当项目需求出现要求表格的内容超出时宽度时鼠标悬浮可看到全部内容,使用el-table表格的带的 show-overflow-tooltip 的属性时存在问题: 鼠标悬浮显示,但是鼠标移动到悬浮内容上时悬浮就取消了。
在寻找解决方案是找到了一个组件 vue-element-table-tooltip 完美的解决了这个问题。
安装:
npm install vue-element-table-tooltip --save
使用:
在main.js中
import elementTableTooltip from 'vue-element-table-tooltip';
import { darkTooltip } from 'vue-element-table-tooltip';
Vue.use(elementTableTooltip, {
theme: 'dark', // dark | light
});
在页面使用中:
直接在 el-table-column 中添加上 v-element-table-tooltip