【学习记录】组件el-dialog开关

直接开整

通过ref获取组件来控制dialog开关

父组件：

//父页面

//引入
import addFroms from "@/components/form/addForms.vue";

//注册
 components: {
    addFroms,
  },

//使用
<addFroms ref="addForms" />

//给按钮绑定点击事件
<el-button type="primary" @click="handleCreate">新增</el-button>


//定义方法handleCreate
handleCreate() {
      this.$refs.addForms.title='新增'
      this.$refs.addForms.open=true
    },

子组件：

//子页面

//open开关   title标题   before-close关闭dialog
<el-dialog :visible.sync="open" :before-close="closedialog" style="width: auto" :title="title"></el-dialog>


data(){
 return {
      open: false,
      title: undefined,
    };
}


methods:{
//在子组件关闭弹窗
closedialog() {
      this.open = false;
    },
}