el-dialog 组件 多层嵌套 被遮罩问题

<el-dialog

title="提示"

:visible.sync="dialogBindUserVisible"

width="30%"

append-to-body

:before-close="handleClose">

<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>

使用 append-to-body属性

el-dialog 组件中的 :append-to-body="true" 属性仍然表示将对话框插入到文档的 <body> 元素中

在使用:append-to-body="true" 属性时可能会导致一些 CSS 样式失效或者需要重新定义,因此应该进行测试以确保对话框的正确显示和功能正常。

相关推荐
+VX:Fegn08951 天前
计算机毕业设计|基于springboot + vue零食商城管理系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·后端·课程设计
Syron1 天前
ScaleSlider 组件实现
javascript
xhxxx1 天前
深入执行上下文:JavaScript 中 this 的底层绑定机制
javascript
DsirNg1 天前
Vue 3:我在真实项目中如何用事件委托
前端·javascript·vue.js
克喵的水银蛇1 天前
Flutter 适配实战:屏幕适配 + 暗黑模式 + 多语言
前端·javascript·flutter
冬男zdn1 天前
Next.js 16 + next-intl App Router 国际化实现指南
javascript·typescript·reactjs
有意义1 天前
this 不是你想的 this:从作用域迷失到调用栈掌控
javascript·面试·ecmascript 6
风止何安啊1 天前
别被 JS 骗了!终极指南:JS 类型转换真相大揭秘
前端·javascript·面试
拉不动的猪1 天前
深入理解 Vue keep-alive:缓存本质、触发条件与生命周期对比
前端·javascript·vue.js
over6971 天前
深入理解 JavaScript 原型链与继承机制:从 instanceof 到多种继承模式
前端·javascript·面试