vue2.0.sync修饰符和自定义组件使用v-model
.sync
<Son :num.sync="num" />
相当于
<Son :num="num" @update:num="num = $event" />
Son组件内部
export default {
props: {
num: {
type: Number,
default: 0
}
},
methods: {
...() {
this.$emit('update:num', ...)
}
}
}
v-model
相关链接:自定义组件的 v-model
v-model在同一只能使用一次
<Son v-model="num" />
相当于:
<Son :value="num" @input="num = $event" />
子组件内部
export default {
props: {
value: {
type: Number,
default: 0
}
},
methods: {
...() {
this.$emit('input', ...)
}
}
}
使用model修改绑定prop和自定义事件
export default {
model: {
prop: 'num',
event: 'changeNum'
},
props: {
num: {
type: Number,
default: 0
}
},
methods: {
...() {
this.$emit('changeNum', ...)
}
}
}
浙公网安备 33010602011771号