vue中input多选_vue的表单的简单介绍 input radio checkbox等表单特性

在vue中我们可以通过v-model来为表单元素实现双向绑定

1:v-model指令

数据的双向绑定

双向绑定是说我们不仅仅可以通过数据(M)的改变去影响视图(V)，还是当视图的内容改变(V)去影响模型中的数据(M)

通常来说双绑定应用在表单中比较多

指令： vue对html元素拓展是一些属性名称(自定义属性名称)

Vue指令有个特点，都是以v-开头的

V-model，它提供了一个js环境，在他的属性之中我们可以使用js(vue实例化对象)中的变量，将表单元素的值与vue实例化对象中是数据属性同步，实现视图到模型中的数据的一个绑定，因此在表单元素上添加了v-model就实现一种双向绑定

{ {msg }}

var myData = {

// 插入的文本

msg: ''

};

// 创建vue对象

var app = new Vue({

el: '#app',

data: myData

})

//实现了input输入内容和h1的双向绑定

2：单选或者多选

它不允许我们输入，只允许我们点击是否被选中

元素属性(checked)的优先级要高于vue实例化对象中数据属性值(适用于所有表单元素)

(1)多选

将checkbox的值写入一个变量中，变量中的每一个属性对应一个checkbox的值

当值是false，多选框不会被选中

注意：在判