el-dialog子组件弹窗控制父组件弹窗

查了一下，还是不太会用，我需要傻瓜式讲解，所以自己记录一下

我需要做到的功能是：

父组件是柱形图，点击柱形图后出来子组件列表弹窗，每一行列表后面有个地图图标，点击图标之后子组件和父组件同时关闭

1.先控制子组件点击图标之后子组件自己的关闭，写了一个方法：

控制dialogVisible的true和false,

初始化的时候 dialogVisible: this.visible,是通过this.visible来控制的

子组件页面：

<template>
  <el-dialog
    append-to-body
    :before-close="close"
    :close-on-click-modal="true"
    :visible.sync="dialogVisible"
  >

所以close方法是（close可以加在点击事件上）

    close() {
      this.$emit("update:visible", false);
    },

close可以加在点击事件上

2.然后是子组件表格弹窗控制父组件柱形图弹窗

用子组件监听父组件，因为是点击图标之后关闭的弹窗，再点击事件里面调用

    close() {
      this.$emit("update:visible", false);
    },
    hanldc