实现思路

根据el-form-item 插槽自定义表头，使用el-tooltip包裹，通过mouseenter事件计算label长度是否溢出来控制el-tooltip的显示隐藏

代码展示

.ts-form-item .el-form-item__label{

white-space:nowrap;

overflow:hidden;

text-overflow:ellipsis;

/*display:inline;*/

}

js

visibleTooltip(e){

this.isShowTooltip = e.target.offsetWidth + 18 - e.fromElement.clientWidth > 0 ? false : true; //18为required *号引起的偏差。

}

注意：上述代码为Element UI 二次封装的组件 根据实际情况调整即可

好文链接

评论可见，请评论后查看内容，谢谢！！！
 您阅读本篇文章共花了：