element UI 之table表格表头过长使用点点...显示,并添加鼠标移入悬浮显示

摘要:
要求:将鼠标移动到标题中:1.添加。el表格。单元格{word break:全部保留!

需求:

element UI 之table表格表头过长使用点点...显示,并添加鼠标移入悬浮显示第1张

鼠标移入表头:

element UI 之table表格表头过长使用点点...显示,并添加鼠标移入悬浮显示第2张

1、样式中添加

.el-table .cell {
word-break: keep-all !important;
white-space: nowrap !important;
}
2、在需要悬浮显示的表头文字过长处添加

:show-overflow-tooltip="true"
:render-header="renderHeader"

3、methods中添加:

renderHeader(h, data) {
return h("span", [
h(
"el-tooltip",
{
attrs: {
class: "item",
effect: "dark",
content: data.column.label,
placement: "top",
},
},
[h("span", data.column.label)]
),
]);
},
————————————————
版权声明:本文为CSDN博主「小柠檬爱编程」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/hong521520/article/details/119644719

免责声明:文章转载自《element UI 之table表格表头过长使用点点...显示,并添加鼠标移入悬浮显示》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇树莓派自动启动登陆与运行程序Android单元测试下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

数据库编程基本练习题

 1、用一条SQL语句查询出每门课都大于80分的学生姓名  准备数据的sql代码: create table score( id int primary key auto_increment, name varchar(20), subject varchar(20), score int); insert into score values (nul...

我的MYSQL学习心得(一) 简单语法

我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据类型 我的MYSQL学习心得(五) 运算符 我的MYSQL学习心得(六) 函数 我的MYSQL学习心得(七) 查询 我的MYSQL学习心得(八) 插入 更新 删除 我的MYSQL学习心得(九) 索引 我的MYSQL学习心得(十) 自定义...

Ajax实现DropDownList与ListBox联动效果

效果图: 目标:选择DropDownList,左侧ListBox从服务器端获取对应项。点击Button,对左、右侧ListBox进行操作。              最后在服务器端获取右侧ListBox的值 过程:          1、首先是给DropDownList弄个数据源,实际开发中一般都是从数据库去。我这演示方便就随便new 了个DataTabl...

el-table 表格循环多张图片

<el-table :data="weekList" stripe tooltip-effect="dark" class="table"> <el-table-column v-for="(item, index) in tableOrderItem":key="index":width="item...

Element-UI中el-table实现简单动态数据绑定的实现

El-Table动态绑定数据的方法 在使用el-table时,有时候数据的列是不固定的,都是通过sql查询来的,怎么实现动态的数据绑定到el-table上了? 看了看官网也没有相关的例子,网上看了下都是封装组件的,咱也不会,最后用了个v-for来实现一下。 后台返回的数据如下: {"评分人":"15034100248","ID":"BD2020091517...

MySQL5.7表空间加密

MySQL5.7开始支持表空间加密了,增强了MySQL的数据文件的安全性,这是一个很不错的一个功能,这个特性默认是没有启用的,要使用这个功能要安装插件keyring_file。 下面就来看看怎么安装,安装这个插件不用重启MySQL 1.安装插件 1.1 安装插件 (mysql5.7)root@localhost [(none)]> INSTALL P...