lovecoding
/
VIP32


			
				
					
						
						
							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">
        <!-- 表单模板：
                输入框 文本域 多选框 单选框 下拉框
        -->
        输入框:<input type="text" v-model="part1">
        <br>
        文本域：<textarea name="" id="" cols="30" rows="10" v-model="part2"></textarea>
        <br>
        单选框: <input type="radio" v-model="part3" value="1">男 <input type="radio" v-model="part3" value="2">女
        <br>
        多选框:  <input value="1" v-model="part4" type="checkbox">唱歌
                <input value="2" v-model="part4" type="checkbox">跳舞
                <input value="3" v-model="part4" type="checkbox">rap
                <input value="4" v-model="part4" type="checkbox">画画
                <input value="5" v-model="part4" type="checkbox">篮球
        <br>
        下拉框：
            <select name="" id="" v-model="part5">
                <option value="小学">小学</option>
                <option value="初中">初中</option>
                <option value="高中">高中</option>
                <option value="大学">大学</option>
            </select>
    </div>
    <script src="./vue.js"></script>
    <script>
        var app = new Vue({
            el:"#app",
            data:{
                part1:"111",
                part2:"这是一段文本",
                part3:"2",
                part4: ["1","3"],
                part5:"高中"
            }
        })
    </script>
</body>
</html>