这里我们学习一个新的技巧,sync修饰符
按照常规,想要让父组件更新showDialog
的话,需要这样做
// 子组件
this.$emit('changedialog', false) //触发事件
// 父组件
<addDialog @changedialog="method" :showDialog="showDialog" />
method(value) {
this.showDialog = value
}
但是,vuejs为我们提供了
sync修饰符
,它提供了一种简写模式 也就是
// 子组件 update:固定写法 (update:props名称, 值)
this.$emit('update:showDialog', false) //触发事件
// 父组件 sync修饰符
<addDialog :showDialog.sync="showDialog" />
只要用sync修饰,就可以省略父组件的监听和方法,直接将值赋值给showDialog