vue提供了 v-model 指令用于表单类元素上双向绑定
可以用于input 和 textarea 等，所现实的值只依赖于所绑定的数据，不在关心初始化插入的value
// input 输入框
<input type="text" v-model="value">
data:{value:''}
// 多行文本框
<text v-model="text" > 多行文本框</textarea>
data:{text: ""}
//单选框 true选中 和 false没选中 用v-model 不管用
<input type="radio" v-bind:checked="oneradio">
data:{oneradio: false}
如果是组合使用，就需要用 v-model 来配合value 使用，绑定选中的单选框value值，此处所绑定的初始值随便给
// 多个单选框
<body>
<div id="app">
狗蛋：<input type="radio" name="one" value='狗蛋' v-model="check">
毛蛋：<input type="radio" name="one" value="毛蛋" v-model="check">
混蛋：<input type="radio" name="one" value="混蛋" v-model="check">
当前选中的：{{check}}
</div>
// 引入 vue
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
new Vue({
el:'#app',
data:{
check:'' // 可以字符串 || 数组
}
})
</script>
</body>
复选框checkbox true| false 布尔值
狗蛋：<input type="checkbox" v-bind:checked="checkboxs">
new Vue({
el:'#app',
data:{
checkboxs:true // 布尔值
}
})
多个复选框checkbox 只能是数组
如果是组合使用，就需要v-model 来配合value使用，v-model 绑定一个数组，如果绑定的是字符串，则会转化为true、false与所绑定的复选框的checked属性相对应
<div>
狗蛋<input type="checkbox" value="狗蛋" v-model="checkboxs">
猫蛋<input type="checkbox" value="猫蛋" v-model="checkboxs">
混蛋<input type="checkbox" value="混蛋" v-model="checkboxs">
当前选中的是：{{checkboxs}}
</div>
new Vue({
el:'#app',
data:{
checkboxs：[] // 只能是数组
}
})
select 下拉框
如果是单选，所绑定的value值初始化为数组，也可以是字符串，有value直接优先匹配value值，没有value就匹配text值
<select v-model="selects" >
<option value="河北" >河北</option>
<option value="北京" >北京</option>
<option value="天津" >天津</option>
</select>
当前选中的是 ：{{selects}}
new Vue({
data:{
selects:[] // 数组也行 字符串也行
}
})
多个下拉框 multiple
如果是多选，需要v-model来配合value使用，v-model绑定一个数组，与复选框类似
<select v-model="selects" multiple >
<option value="河北" >河北</option>
<option value="北京" >北京</option>
<option value="天津" >天津</option>
</select>
当前选中的是 ：{{selects}}
new Vue({
data:{
selects:[] // 数组也行 字符串也行
}
})
注意:
1.如果是单选框，初始化值最好是字符串 "" 2.如果是多选框，初始化值最好是数组 [] 3.v-model 肯定是绑定在select上的
单选按钮
<input type="checkbox" v-model="radios" v-bind:value="one">
new Vue({
data:{
radios:true,
one:'123'
}
})
// 只需要用v-bind给单选框绑定一个value值，此时v-model绑定的就是他的value值
