.sync修饰符就是一个编译时语法糖
在Vue的里面尤大定了些规则:
- 组件不能修改
props外部数据 this.$emit可以出发事件,并传参$event可以获取$emit传的参数
在有些情况下,我们可能需要对一个 prop 进行“双向绑定”,真正的双向绑定会带来维护上的问题,因为子组件可以变更父组件,且在父组件和子组件都没有明显的变更来源。通过update:myPropName的模式触发事件来通知父组件传来的值需要变化,从而改变父组件里的数据,实现了prop的“双向绑定”。
1.父组件的一种写法
2.父组件上使用语法糖
.sync
3.子组件上的用法不变,依旧使用
$emit的方法触发事件并传参
由于想要对prop进行“双向绑定”的这种场景很常见,尤大发明了
.sync这种编译时语法糖,方便开发者使用
PS:
需要注意的点是,命名,上图中的我所有写anyName的地方可以改其它名,但必须各处一样,这是用语法糖的前提。