element对话框遮罩层和弹出内容样式优先级错误

最新推荐文章于 2024-06-26 15:28:13 发布

原创最新推荐文章于 2024-06-26 15:28:13 发布 · 651 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #elementui #前端 #vue.js

该代码展示了一个在Vue.js应用中使用el-dialog组件的示例，通过设置append-to-body=true属性，将对话框添加到body，确保其在页面布局中的正确显示。此外，还包括了对话框的可见性控制、宽度设置以及关闭回调函数。

代码

加入:append-to-body="true"就可以了

    <el-dialog :title="title" :visible="shows" :append-to-body="true" width="30%" :before-close="handleClose">
      <span>{{ "&emsp;&emsp;"+ message }}</span>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="handleClose">确 定</el-button>
      </span>
    </el-dialog>