关于使用 vxe-table 时设置了 show-overflow tooltip 不展示的问题(Dialog 组件和 table 同时使用)

众所周知,vxe-table 是可以支撑万级数据渲染的表格组件,本质上还是用了虚拟滚动的实现。之前一直知道vxe-table, 但是基本没有机会用的上这个组件,最近在开发埋点数据的统计,后端一次性返回了上千条数据,elementui 的 table 组件就明显有点卡顿,因为每一行都有很多列。当后端说如果卡顿就限制下返回数据量的时候,我站出来了直接说我这边处理一下,最少接收个几千条还是没有问题的。vxe-table 就这样来到我的项目,下面是截图,看得出字段还是不少的。

遇到的问题

我在项目里面使用的场景是 ElementUI 的弹框组件(Dialog)结合 vxe-table 来使用的。当我设置了 show-overflow 的时候提示框无论如何都展示不出来,因为 Dialog 组件的层级太高了,在 vxe-table 里面 tooltip 的层级是100,而 Dialog 远远大于这个层级。

只需要配置下 tooltip 的层级就可以搞定了

js 复制代码
VXETable.config({
  tooltip: {
    zIndex: 99999,
  },
})
相关推荐
Larcher17 小时前
新手也能学会,100行代码玩AI LOGO
前端·llm·html
徐子颐17 小时前
从 Vibe Coding 到 Agent Coding:Cursor 2.0 开启下一代 AI 开发范式
前端
小月鸭17 小时前
如何理解HTML语义化
前端·html
jump68018 小时前
url输入到网页展示会发生什么?
前端
诸葛韩信18 小时前
我们需要了解的Web Workers
前端
brzhang18 小时前
我觉得可以试试 TOON —— 一个为 LLM 而生的极致压缩数据格式
前端·后端·架构
yivifu18 小时前
JavaScript Selection API详解
java·前端·javascript
这儿有一堆花18 小时前
告别 Class 组件:拥抱 React Hooks 带来的函数式新范式
前端·javascript·react.js
十二春秋18 小时前
场景模拟:基础路由配置
前端
六月的可乐18 小时前
实战干货-Vue实现AI聊天助手全流程解析
前端·vue.js·ai编程