2020-02-28 15:11:40 版本 : 父子组件实现数据双向绑定
作者: 陈婉 于 2020年02月28日 发布在分类 / 人防组 / 人防前端 下,并于 2020年02月28日 编辑
 历史版本

修改日期 修改人 备注
2020-02-28 15:42:03[当前版本] 陈婉 格式调整
2020-02-28 15:11:40 陈婉 创建版本

使用$emit来实现: 子组件通过$emit函数触发一个方法给父组件,附加上回传的值。父组件做该方法监听即可得到子组件回传的值。

1.子组件通过props接收父组件传递过来的数据modalStatus

props:{
     modalStatus:Boolean
}
2.子组件接收并赋值给内部数据openSatuts

data(){
     return{
          openStatus:this.modalStatus;
     }
}
3.子组件中监听 openSatuts的变化,并通过$emit和update传给父组件

watch:{
     openStatus(val){
          this.$emit("update:modalStatus",val)
     }
}
4.示例:




历史版本-目录  [回到顶端]
    知识分享平台 -V 4.8.7 -wcp