message的警告弹窗放在最上层

最新推荐文章于 2024-06-05 16:51:43 发布

__十七

最新推荐文章于 2024-06-05 16:51:43 发布

阅读量5.2k

点赞数 3

分类专栏： Vue 文章标签： vue.js elementui 前端

本文链接：https://blog.csdn.net/wlijun_0808/article/details/125091448

版权

Vue 专栏收录该内容

59 篇文章 5 订阅

订阅专栏

情况：当页面上有弹窗的时候，message弹窗就会被其他弹窗所掩盖，因此就必须得提高message的样式层级

我们常用的$message,其实就是element-ui中的Message组件。

在文档说明的地方，可以看见Message组件有一个自定义的类 customClass，就可以通过这个来进行设置。

样例：

this.$message({

            type: 'warning',

            message: '请先创建枚举值再进行编辑！',

            customClass: 'messageIndex'

          });

//！！！！ 一定是没有scoped的style标签里面
<style>

.messageIndex {

  z-index: 9999 !important; // 设置的值一定要比2007大，因为dialog的层级是2007

}

</style>