vue+elementui--$message提示框被dialog遮罩层挡住问题解决
在Vue中使用Element UI时，如果你遇到了$message提示框被Dialog遮罩层遮挡的问题，可以通过调整$message的z-index来解决。Element UI的$message方法返回的是一个Message实例，你可以在调用时设置zIndex属性。
解决方案：
- 在调用
$message时直接设置zIndex：
this.$message({
message: '这是一条消息',
zIndex: 3000 // 设置一个比Dialog的zIndex更高的值
});- 如果你需要全局设置
zIndex，可以在Vue的原型上添加一个自定义方法，在该方法内统一设置zIndex：
// main.js 或者其他初始化的文件
Vue.prototype.$myMessage = (options) => {
if (typeof options === 'string') {
options = {
message: options
};
}
options.zIndex = 3000; // 设置一个高于Dialog的zIndex值
return this.$message(options);
};然后在组件中使用this.$myMessage来代替this.$message。
请确保设置的zIndex值在比Dialog的zIndex值更高的情况下，这样$message提示框就不会被遮挡了。
评论已关闭