[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插件做图片展示预览遇到弹框再次打开无法预览图片问题

相关推荐
椒盐螺丝钉7 小时前
Vue Router应用:组件跳转
前端·javascript·vue.js
芳草萋萋鹦鹉洲哦9 小时前
【vue】调用同页面其他组件方法几种新思路
前端·javascript·vue.js
爱泡脚的鸡腿12 小时前
uni-app D4 实战(小兔鲜)
前端·vue.js·架构
广白12 小时前
钉钉小程序直传文件到 阿里云OSS
前端·vue.js·uni-app
摇滚侠13 小时前
Vue 项目实战《尚医通》,完成订单详情静态的搭建,笔记47
vue.js·笔记
特级业务专家14 小时前
续集:Vite 字体插件重构之路 —— 从“能用”到“生产级稳定”
javascript·vue.js·vite
Coder-coco14 小时前
个人健康系统|健康管理|基于java+Android+微信小程序的个人健康系统设计与实现(源码+数据库+文档)
android·java·vue.js·spring boot·微信小程序·论文·个人健康系统
一 乐16 小时前
英语学习激励|基于java+vue的英语学习交流平台系统小程序(源码+数据库+文档)
java·前端·数据库·vue.js·学习·小程序
老华带你飞16 小时前
个人健康系统|健康管理|基于java+Android+微信小程序的个人健康系统设计与实现(源码+数据库+文档)
android·java·vue.js·微信小程序·论文·毕设·个人健康系统
JIngJaneIL16 小时前
停车场管理|停车预约管理|基于Springboot+的停车场管理系统设计与实现(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·notepad++·停车场管理|