elementui 弹窗遮罩问题;Message层级问题(被遮罩、弹窗遮住,设置层级;弹窗内容被遮罩遮挡)
解决弹窗内容被遮罩遮住、弹窗层级样式不够问题情况一:弹窗层级样式不够。elementui文档上,Message板块有写到可以提供自定义class。通过自己设置类名,可以对其设置相关css属性。情况二: 弹窗内容被遮罩遮住。
·
目录
$Message: 提示信息被弹窗(遮罩)遮住。只是层级样式不够
elementui 文档上,Message板块有写到 customClass 可以提供自定义class。通过自己设置类名,可以对其设置相关css属性。
示例(因弹窗层级过高,遮挡住了消息提示,单独设置信息提示的层级)
this.$message({
message: "提示信息",
type: "warning",
customClass: 'messageIndex'
})
.messageIndex {
z-index: 3000 !important;
}
弹窗、抽屉: 内容被遮罩遮挡、层级不起效果、需要点击一次遮罩才进行呈现
考虑是因为遮罩层默认添加到了body元素上造成的影响,解决方案是将其添加到其盒子父元素上。通过设置对应属性modal-append-to-body值为false进行改变。(之前遇到过element的遮罩遮住了弹窗内容,需要点击一下弹窗内容才能呈现。也是通过设置这个属性得以解决)
贴一张官方文档的图:
更多推荐
活动日历
查看更多
直播时间 2025-02-26 16:00:00


直播时间 2025-01-08 16:30:00


直播时间 2024-12-11 16:30:00


直播时间 2024-11-27 16:30:00


直播时间 2024-11-21 16:30:00


目录
所有评论(0)