vue-elementui弹出框显示隐藏

在 Vue.js 中使用 Element UI 的弹出框组件可以通过控制 v-model 指令来实现显示和隐藏。

首先，确保你已经安装了 Element UI 并正确引入了它。然后，你可以在 Vue 组件中使用 `<el-dialog>` 标签来创建一个弹出框。

下面是一个简单的示例：

<template>
  <div>
    <el-button @click="showDialog">显示弹出框</el-button>
    <el-dialog v-model="dialogVisible">
      <!-- 弹出框内容 -->
      <span>这是一个弹出框</span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false, // 控制弹出框的显示和隐藏
    };
  },
  methods: {
    showDialog() {
      this.dialogVisible = true; // 显示弹出框
    },
  },
};
</script>

在上面的代码中，通过 `v-model="dialogVisible"` 将 `dialogVisible` 属性与弹出框的显示状态绑定起来。当点击按钮时，调用 `showDialog` 方法将 `dialogVisible` 设置为 `true`，从而显示弹出框。

你可以根据自己的实际需求，修改弹出框组件的内容和样式。希望对你有帮助！