lovecoding
/
W0407


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="app">
        <h1>{{msg}}--{{part}}--{{part1}}--{{part2}}</h1>
        <div>
            文本域: <textarea v-model="msg"></textarea>
        </div>
        <div>
            单选: <input type="radio" v-model="part" value="1" />男<input type="radio" v-model="part" value="2" />女
        </div>
        <div>
            多选: <input type="checkbox" v-model="part1" value="1">篮球 <input type="checkbox" v-model="part1" value="2">足球 <input type="checkbox" v-model="part1" value="3">羽毛球
        </div>
        <div>
            <select v-model="part2">
                <option value="1">小学</option>
                <option value="2">初中</option>
                <option value="3">高中</option>
                <option value="4">大学</option>
            </select>
        </div>
    </div>
    <script src="./vue.js"></script>
    <!-- 
        模版语法：
            插值语法:{{}} 将数据渲染到页面上
            内置指令:v-xxx
    -->
    <script>
        var app = new Vue({
            el:"#app",
            data:{
                msg:"你好啊",
                part: "2",
                part1:["1","3"],
                part2:"2"
            }
        })
    </script>
</body>
</html>