element ui 通过 .sync 设置打开或关闭自己创建的dialog弹出层

例子:

// 父组件

......

<test-dialog :dialogOpen.sync="open" />

......

improt testDialog from "./testDialog"

...... 

data(){
    return{
        open:false
    }
},
methods:{
    testFunction(){
        this.open = !this.open;
    },
}

// 子组件
<el-dialog
    title="详情"
    :visible.sync="dialogOpenComputed"
  >
   ...... // 省略无关显示内容
</el-dialog>

......// 省略无关内容
props:{
    dialogOpen:{
        type:Boolean,
        default:false
    }
}
......// 省略无关内容
computed:{
    dialogOpenComputed:{
        get(){
            return this.dialogOpen;
        },
        set(value){
            // 此处使用update:来修改父组件中dialogOpen的属性值,具体怎么使用请自行百度
            this.$emit("update:dialogOpen", value);
        }
    }
}

    

  

 

posted @ 2021-09-08 15:12  假装空白  阅读(635)  评论(0)    收藏  举报