el-tooltip-文字2行溢出展示,文字不溢出不展示的功能实现

#工作记录

问题

要在el-table中实现如下功能,文字两行时出现...,并且鼠标移动上去要展示tips

解决思路

主要问题是当省略符号出现时,要允许tips出现。网上的其他人的解决思路是通过创建span标签来获取文字单行宽度,然后比较得出是否出现...

对于超过两行的文本显示省略号,并且显示el-tooltip - 简书 (jianshu.com)icon-default.png?t=N7T8https://www.jianshu.com/p/af4e2fb8164a

除此以外,我发现通过比较当前div的scrollHeight和clientHeight也可以判断。

scrollHeight是实际高度,clientHeight是展示区域的高度,当实际高度大于显示区域高度,说明出现了省略号。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值