1. 组件内部声明关闭变量
   :visible.sync=”visible”

2. 组件内部声明关闭方法
   @close=”DialogClose”

3. 监控父级关闭变量关闭当前
   this.visible = this.DialogVisibleFlag

4. 异步更新父级关闭变量
   this.$emit(“update:DialogVisibleFlag”, false)

<template>
  <el-dialog
    :show-close="true"
    :visible.sync="visible"
    :close-on-click-modal="false"
    @close="DialogClose">
    // some content
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" plain @click="DialogClose">取消</el-button>
      <el-button type="primary" @click="onConfirm">确定</el-button>
    </div>
  </el-dialog>
</template>
<script>
export default {
    // ....
    return {
      visible: false,
    },
    watch: {
        DialogVisibleFlag() {
          this.visible = this.DialogVisibleFlag // 2. 监控父级关闭变量关闭当前
        }
    },
    methods: {
        DialogClose() {
          this.$emit("update:DialogVisibleFlag", false) // 4.异步更新父级关闭变量
        }
    }
}
</script>