简单封装el-popover用于el-table-column里渲染

单行或多行文本溢出显示省略号,是很常见的需求。
然后今天遇到复杂点的需求,在el-table里有些单元格文本长,有些短,需要判断是否溢出,溢出时弹框显示所有文本。
判断文本是否溢出,参考此文 https://juejin.im/post/5d7798dc6fb9a06acc00af6c
但是,在el-table里,单元格是el-table-column渲染的,而el-popover好像没有提供相关处理逻辑,所以需要简单封装一下,以便在el-table-column 里渲染。

没有时间整理文字,暂记。




全局样式里需要提供 .text-ellipsis .text-ellipsis-2 .text-ellipsis-3 以及 popover-when-ellipsis 四个类样式。

然后,就可以方便地进行循环渲染了。


          
 

data 里可以集中管理数据,在 shownCols 数组里。

你可能感兴趣的:(前端日常,vue,vue.js)