vue2中的el-dialog控制显示隐藏的变量由父组件传到子组件中，如何修改父组件中的状态

在Vue2中，如果你想要在父组件通过props将`el-dialog`的显示/隐藏状态传递给子组件，并在父组件中修改这个状态，可以按照以下步骤操作：

1. **创建父组件**：
在父组件模板中，绑定一个v-bind:class属性，根据dialog的状态动态添加或移除对应的类名。比如你可以定义一个布尔属性`dialogVisible`：

   <template>
     <div>
       <button @click="toggleDialog">打开/关闭 Dialog</button>
       <el-dialog :visible.sync="dialogVisible">
         <p>这是子组件的内容...</p>
       </el-dialog>
     </div>
   </template>

   <script>
   export default {
     data() {
       return {
         dialogVisible: false, // 初始状态为隐藏
       };
     },
     methods: {
       toggleDialog() {
         this.dialogVisible = !this.dialogVisible; // 修改状态并同步给子组件
       }
     }
   };
   </script>

2. **使用sync修饰符**：
`:visible.sync` 这里的 `sync` 是 Vue 的特殊语法，它使得父组件对 `dialogVisible` 的更改会自动同步到子组件。反之亦然。

当你在父组件点击按钮时，`toggleDialog` 方法会被触发，`dialogVisible` 的值会被改变，进而更新子组件的`el-dialog` 显示状态。