我们在使用Vue处理表单数据的时候,通过v-model实现双向数据绑定
v-model会同时监视表单输入、模型数据的更新,如果表单内容变化了,模型中的变量会跟着变化,同样,模型中的变量发生变化了,视图层(界面也会跟着变化)
1,输入框
v-mode会将输入框的内容赋值给变量,同样,变量内容变化了,输入框的内容也跟着变
<input type="text" v-model='testdata'/>
2,复选框
tom jack lucy
{{arrTabs}}
3,单选框
4,select列表
<div id="app">
<select v-model="selectData">
<option value="">请选择</option>
<option value="Apple">苹果</option>
<option value="blalala">香蕉</option>
</select>
<div>
选择的水果是: {{selectData}}
</div>
</div>
<script type="text/javascript">
new Vue({
el:'#app',
data:{
selectData:''
}
});
</script>