Dialog 对话框
用于弹出窗口
按需引入方式
如果是完整引入可跳过此步骤
import Vue from 'vue'
import { Dialog } from 'element-ui'
import 'element-ui/lib/theme-chalk/base.css'
import 'element-ui/lib/theme-chalk/dialog.css'Vue.use(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>
Attributes
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| visible | 是否显示 Dialog | boolean | false |
| title | 标题 | string | |
| width | Dialog 的宽度 | string | 50% |
| ... |
原文链接：菜园前端
