element弹窗 自定义组件时z-index计算错误

339 阅读1分钟

1.前言

我们知道Element中新的弹出框的展示,总是覆盖着上一个弹出框。实现覆盖功能需要保证新的弹出框的z-index要比旧的弹出框的z-index值相等或着更高,

为达到这个目的element为所有的弹出框(所有下拉框、提示框、Dialog对话框等等)直接或间接的使用到一个js组件element-ui/src/utils/popup

2.遇到的问题

使用原生element组件弹窗没什么问题,但是因为项目中需要改动日期组件的,所以复制了一份elementmessageBox源码做改动。

后面发现自定义弹窗的z-index计数和element组件其他弹窗的z-index 是分开计数的,导致被覆盖,

3.解决

修改main.vue,将原先
import Popper from 'element-ui/src/utils/popup'
修改为
import Popper from 'element-ui/lib/utils/popup'