vue el-dialog嵌套解决无法点击问题

产生原因:

当你在 el-dialog 上嵌套另一个 el-dialog 窗口时,可能会遇到内部对话框无法点击的问题。这通常是由于嵌套对话框的遮罩层(overlay)或其他样式问题造成的。

解决方案:

如果你的 el-dialog 组件支持 append-to-body 属性,你可以将对话框附加到 body 元素上,以避免 z-index 问题。

复制代码
<template>
  <el-dialog :visible.sync="isVisible" :before-close="handleClose" append-to-body>
    <p>外层对话框</p>
    <el-dialog :visible.sync="innerVisible" :before-close="handleInnerClose" append-to-body>
      <p>内层对话框</p>
    </el-dialog>
  </el-dialog>
</template>
相关推荐
神秘的猪头17 分钟前
🎨 CSS 这种“烂大街”的技术,怎么在 React 和 Vue 里玩出花来?—— 模块化 CSS 深度避坑指南
css·vue.js·react.js
夏天想18 分钟前
element-plus的输入数字组件el-input-number 显示了 加减按钮(+ -) 和 小三角箭头(上下箭头),怎么去掉+,-或者箭头
前端·javascript·vue.js
进击的野人22 分钟前
Vue 3 响应式数据解构:toRef 与 toRefs 的深度解析
前端·vue.js·前端框架
清风徐来QCQ1 小时前
SpringMvC
前端·javascript·vue.js
TttHhhYy1 小时前
小记,antd design vue的下拉选择框,选项部分不跟着滑动走,固定在屏幕某个部位,来改
前端·vue.js·sql
boooooooom1 小时前
Vue3 宏编译的限制与解决方案:深入理解与实践突破
vue.js
Hi_kenyon2 小时前
快速入门VUE与JS(二)--getter函数(取值器)与setter(存值器)
前端·javascript·vue.js
3秒一个大2 小时前
模块化 CSS:解决样式污染的前端工程化方案
css·vue.js·react.js
幽络源小助理2 小时前
Springboot机场乘客服务系统源码 – SpringBoot+Vue项目免费下载 | 幽络源
vue.js·spring boot·后端
小酒星小杜2 小时前
在AI时代,技术人应该每天都要花两小时来构建一个自身的构建系统
前端·vue.js·架构