Element 表头排序强制不换行

最新推荐文章于 2024-03-25 16:40:27 发布

丸子吖嘿

最新推荐文章于 2024-03-25 16:40:27 发布

阅读量2.7k

点赞数

分类专栏： Element

本文链接：https://blog.csdn.net/qq_29050279/article/details/106495797

版权

9 篇文章 0 订阅

订阅专栏

给table加一个class，以免影响其他table样式

<el-table :data="tableData" @sort-change="sortChange" class="nowrap-tab" border highlight-current-row> 
</el-table>

重写样式

.nowrap-tab .el-table__header .cell{
   padding: 0!important;
   text-overflow: unset!important;
   white-space:nowrap!important
}

效果如下，只有表头不会换行，body正常换行
在这里插入图片描述
补充：样式写到th上是不起效果的，写到cell上才有效果

其他方式，看了很多答案是用render-header属性，大概思路是利用这个函数根据lable的每个字体所占宽度 * 字数+排序图标宽度=当前列的宽度，有点复杂懒得研究

关注