v-model指令的学习


v-model的原理

v-model="message"   ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
就相当于先用一个v-bind绑定一个值  v-bind:value="message"

再用v-on绑定一个事件   @input=“message=$event.target.value”

v-model绑定radio

v-model绑定 checkbox 单选框或者多选框

 绑定多选框可以直接声明一个数组变量  例如 hobbies:[]

在多选框标签绑定一个v-model="hobbies"

在选择后 他会自动将选择的值加入进hobbies数组中

 
v-model的修饰符

.lazy  就是在用户输入时数据不会进行传输,在失去焦点后或者按回车,才会将数据将进行改变

.number  因为v-model所绑定的数据,都会默认转换为string类型,而.number就能将数据转换为number类型

.trim  去除用户输入的左右两边的空格