vue使用多级弹窗(Dialog)出现蒙版遮罩问题
场景:结果列表按钮对应了一个结果列表弹窗,页面中每条结果后又有下载和查看结果按钮,查看结果按钮很明显由对应一个弹窗页面。因此这属于多级弹窗(使用的是Dialog),当出现第一级弹窗时,可以正常关闭开启;当出现第二级弹窗后,第二级弹窗打开后就无法关闭,很明显是出现了蒙版遮罩问题。效果演示:(图二完全置灰,无法点击任何按钮)解决方案:出现蒙版遮罩和层级肯定是有关,但是尝试设置z-i...
·
场景:结果列表按钮对应了一个结果列表弹窗,页面中每条结果后又有下载和查看结果按钮,查看结果按钮很明显由对应一个弹窗页面。因此这属于多级弹窗(使用的是Dialog),当出现第一级弹窗时,可以正常关闭开启;当出现第二级弹窗后,第二级弹窗打开后就无法关闭,很明显是出现了蒙版遮罩问题。
效果演示:(图二完全置灰,无法点击任何按钮)
解决方案:
出现蒙版遮罩和层级肯定是有关,但是尝试设置z-index没有任何效果。查看https://element.eleme.io/#/zh-CN/component/dialog官网Dialog对话框参数中有:
这两个属性是关于遮罩层问题的,添加 :append-to-body="true" 后,就解决了遮罩层的问题,可以参照下属性说明来理解下。
更多推荐
已为社区贡献6条内容
所有评论(0)