.sync 修饰符

发布时间 2023-10-09 21:09:20作者: 嘎嘎鸭2

作用:可以实现 子组件 与 父组件数据 的 双向绑定,简化代码

特点:prop 属性名可以自定义,非固定为 value

本质:就是   :属性名 和 @update : 属性名 的合写

应用场景:封装弹窗类的基础组件,visible 属性 true 显示,false 隐藏

 

eg:

父组件:

<BaseDialog   :visible.sync = "isShow"> </BaseDialog>     等价于→     <BaseDialog   :visible = "isShow"   @update : visible = "isShow = $event"> </BaseDialog>

 

子组件:

props : {

      visible : Boolean

} ,

this.$emit ( ' update : visible ' ,  false)