[element-ui] el-dialog和v-viewer的层级问题

问题描述 :当el-dialogv-viewer⼀起使⽤时,点击图⽚预览,会出现预览的图⽚z-index⽐el-dialog

原因el-dialog默认的z-index是2000 ,每次关闭后再次打开z-index会递增2左右,v-viewer的层级默认是2015 ,这样预览不了⼏次,就会出现el-dialog的z-index⼤于v-viewer的z-index

需要修改viewer的默认层级,我这里是在全局定义修改的,仅供参考

js 复制代码
import Viewer from 'v-viewer' // 图片预览
import 'viewerjs/dist/viewer.css'
js 复制代码
Vue.use(Viewer, {
  defaultOptions: {
    zIndex: 9999,
  } })

或者

js 复制代码
Vue.use(Viewer);
Viewer.setDefaults({
  Options: {
    'zIndex': 9999,
	 ...
  }
})

参考:

vue使用v-viewer插件做图片展示预览遇到弹框再次打开无法预览图片问题

相关推荐
清风细雨_林木木6 分钟前
Css样式中设置gap: 12px以后左右出现距离问题解析
css·vue.js·elementui
用户214118326360220 分钟前
N8N教程-手把手教你搭建 N8N 自动化工作流:从安装到云部署全流程实战
前端·vue.js
北辰alk2 小时前
Vue项目搜索引擎优化(SEO)完全指南:从原理到实践
vue.js
北辰alk2 小时前
Vue CLI 中常用的加载器及其配置详解
vue.js
吹牛不交税4 小时前
vue3+element plus 自定义组件,单列的方块 图形加文字列表
前端·javascript·vue.js
北辰alk6 小时前
Vue Router 组件内路由钩子详解
vue.js
北辰alk6 小时前
深入理解跨域问题及Vue项目中的解决方案
vue.js
FuckPatience7 小时前
UI 资源整合
ui·c#
bug总结7 小时前
如何在 Vue.js 中集成 Three.js —— 创建一个旋转的 3D 立方体
前端·javascript·vue.js
zhonghuagongren8 小时前
高考加油!UI界面生成器!
python·学习·ui·高考