组件使用
1.使用Tooltip 文字提示组件https://element-plus.gitee.io/zh-CN/component/tooltip.html
思路:
css:label溢出隐藏
html结构：

<div
class="myNote"
@mouseenter="showToopltip($event, item, 'neirong', 'showTooltipname')"
>{{ item.neirong }}


js逻辑思路:
1. js移入事件 mouseenter 获取当前移入的元素
2. 封装函数动态获取当前移入的label的宽度也就是checkbox文字部分
3. 动态创建span span里面的文本就是label的文本，并获取宽度
4. 动态拿到的label宽度和span的宽度对比
5. 如果span的宽度大于label的宽度 就让Tooltip组件 disabled属性为false 反之true
逻辑代码：
export const showToopltip = (obj, row, columnName, show) => {
/obj为鼠标移入时的事件对象/
/currentWidth 为文本在页面中所占的宽度，创建标签，加入到页面，获取currentWidth ,最后在移除/
/**
* @enum columnName 表示显示的变量
* @enum show toopltip disabled属性的变量
*/
if (row[columnName]) { //如果为空值的话 不用再创建dom元素 影响性能
let TemporaryTag = document.createElement("span");
TemporaryTag.innerText = row[columnName];
TemporaryTag.className = "getTextWidth";
document.querySelector("body").appendChild(TemporaryTag);
let currentWidth = document.querySelector(".getTextWidth").offsetWidth;
document.querySelector(".getTextWidth").remove();
const cellWidth = obj.target.parentNode.offsetWidth;
currentWidth <= cellWidth + 10 ? (row[show] = true) : (row[show] = false);
} else {
row[show] = true;
}
};