为什么 vue element ui的dialog需要用 sync 修饰 visible?(visible.sync)

1,219 阅读1分钟

作为一个后端开发者,前端虽然也需要涉及,但是了解的不够多,最近在使用vue element ui的组件时,发现指定dialog是否展示的组件,需要在visible属性后添加 .sync。因此特意去查了一下.sync的作用。

彻底明白VUE修饰符sync

在子组件需要改变父组件的属性时,使用真正的双向数据绑定会导致维护升本的上升。所以子组件是通过update:my-prop-name 的模式来替代事件触发,目的是为了优雅而不粗鲁的实现父子组件间的双向绑定。

对于类似dialog这种组件,点击父组件中的某个按钮,改变父组件中的某个属性触发dialog的展示。但是隐藏或者关闭按钮往往都在dialog子组件中,所以此时就需要子组件去修改父组件的属性,而.sync的写法,实际上就是一个语法糖,可以让子组件更方便的更改父组件的属性。