el-table 内容太多 show-overflow-tooltip 显示不下,闪烁抖动不显示

问题描述(show-overflow-tooltip)
1. element表格内容过多,鼠标悬浮显示全部内容,内容过长显示悬浮抖动
2. show-overflow-tooltip数据过多时(超过3000字符)闪烁不显示
3. 当某一列字符内容超长时,鼠标移入会出现闪烁不显示提示
————————————————

方法一: el-popover 代替 show-overflow-tooltip


   

         重写el-popover的样式, 保持跟tooltip提示框样式一致,el-popover宽度可以使用max-width显示, 超出行省略,同时限制的宽度时,设置多少行的限制,否则当内容几千以上就易有bug;为了调整正好15行省略时的样式看起来不会出问题,可以调padding,line-height,font-size保证展示框样式完整。

el-table 内容太多 show-overflow-tooltip 显示不下,闪烁抖动不显示_第1张图片

el-popover样式需要放在不含scoped的style样式中,为了防止污染全局el-popover样式,要给el-popper添加类名:popper-class="XXX"

el-table 内容太多 show-overflow-tooltip 显示不下,闪烁抖动不显示_第2张图片

 方法二:使用 show-overflow-tooltip超过一定的行数显示 ...

         css方法同上述方法一差不多,样式一般是全局的,不能加scoped



你可能感兴趣的:(elementui,vue.js,elementui,javascript)