1. model选项是什么?
model是Vue修改v-model绑定属性和默认绑定方法的选项;
v-model语法糖:
<input v-model="num" type="text" />
等价于=>
<input v-bind:velue="num" v-on:input="$event.target.value" />
model默认情况下:{prop:’value’,event:’change’},默认绑定输入框value属性和change方法;修改model属性可以自定义属性,修改触发方式。
2. 如何使用
export default { //model修改默认绑定属性和方法
model: { prop: "checked", event: "hahaha" },
//对应model.prop绑定的属性 props: { checked: Boolean },
//对应model.event绑定的方法,this.$emit方式执行该方法
methods: { clickFirstClass() { this.$emit("hahaha", true); } }
}
3. 常见使用场景
因为model默认绑定的是输入框value属性,一些输入类型比如单选框和复选框按钮可能想使用 value
prop 来达到不同的目的。使用 model
选项可以回避这些情况产生的冲突。