el-image 和 el-table冲突层级冲突问题

其中原理,很多博客已经所过了,table组件中使用图片,会出现层级过低问题,

网上大部分解决方式是 使用穿透

javascript 复制代码
// 单元格样式
::v-deep(.el-table__cell) {
    position: static !important;
}

我在此不推荐这种解决方式,原因:此样式,会影响 单元格合并时 border显示bug

更好的解决方式其实就写在官方文档下方

只需在加入preview-teleported 将插入地址定为body,即可解决

javascript 复制代码
<el-image :preview-src-list="srcList" fit="cover" preview-teleported />
相关推荐
徐同保2 分钟前
react useState ts定义类型
前端·react.js·前端框架
liangshanbo12159 分钟前
React 19 vs React 18全面对比
前端·javascript·react.js
望获linux21 分钟前
【实时Linux实战系列】Linux 内核的实时组调度(Real-Time Group Scheduling)
java·linux·服务器·前端·数据库·人工智能·深度学习
Never_Satisfied25 分钟前
在 JavaScript 中,删除数组中内容为xxx的元素
java·前端·javascript
_菜鸟果果25 分钟前
Vue3+echarts 3d饼图
前端·javascript·echarts
Sheldon一蓑烟雨任平生1 小时前
Vue3 列表渲染
vue.js·vue3·v-for·列表渲染·vue3 列表渲染·v-for 循环对象·v-for与计算属性
rechol1 小时前
类与对象(中)笔记整理
java·javascript·笔记
Luffe船长1 小时前
前端vue2+js+springboot实现excle导入优化
前端·javascript·spring boot
Demoncode_y2 小时前
前端布局入门:flex、grid 及其他常用布局
前端·css·布局·flex·grid
明天最后2 小时前
使用 Service Worker 限制请求并发数
前端·service worker