community/forum/vuejs/element-ui/components/dialog

Element UI Dialog 组件是 Vue.js 框架中用于创建对话框的组件。它提供了丰富的配置选项和灵活的用法，可以帮助你轻松地实现各种弹出对话框。

基本用法

Dialog 组件的基本用法如下：

<template>
  <el-button @click="dialogVisible = true">点击打开 Dialog</el-button>
  <el-dialog
    title="提示"
    :visible.sync="dialogVisible"
    width="30%"
  >
    <span>这是一段信息</span>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false
    };
  }
};
</script>

属性

• title: 对话框标题。
• visible: 对话框是否显示。
• width: 对话框宽度。

事件

• open: 对话框打开时触发。
• close: 对话框关闭时触发。

更多关于 Element UI 的信息，请访问我们的官方文档。

Vue.js