VUE配合iview使用Tooltip实现表格显示指定行数,鼠标悬停时显示全部
//lines 行数
//content 内容
function toolTipUtil(h, lines, content) {
return h('Tooltip', {
props: {placement: 'bottom-start', transfer: true}
}, [
//这里是表格显示的内容及样式
h("div", {
style: {textOverflow: 'ellipsis', whiteSpace: 'normal',overflow: 'hidden',display: '-webkit-box', webkitBoxOrient:'vertical', webkitLineClamp: lines+'',wordBreak: 'break-all' }
}, content),
//这里是tips
h("div",{
slot: 'content',
style: {textOverflow: 'ellipsis', whiteSpace: 'normal',overflow: 'hidden',display: '-webkit-box', webkitBoxOrient:'vertical', webkitLineClamp: lines+'',wordBreak: 'break-all' }
}, content)
])
}
![在这里插入图片描述](https://img-blog.csdnimg.cn/123b6c7b84ce437cbabb8f57e4847793.png)