Vue、Element-ui中tabel表头自定义与强制不换行显示_elementui表头一行显示

作者：weixin_40725706 | 2024-02-20 02:12:20

踩

elementui表头一行显示

Element-ui中tabel表头自定义与强制不换行显示

在使用element-ui组件库进行表格渲染时，难免会遇到表头（列标题）的自定义，以及表头过长时多行显示的单行化，超出部分用…代替且光标悬浮显示完整表头的问题。下面我将自己的解决方法、详细过程与大家分享，具体如下：
一、表头自定义
通过查询官方文档得知
在这里插入图片描述具体效果如下：
二、表头强制不换行显示且光标悬浮显示完整表头

为el-tabel添加动态 class
为表头与表格内容分别添加css样式
在data中分别为它们添加溢出隐藏
为表格内需要显示的地方添加点击显示与隐藏事件

这样即可实现该功能。
具体效果如下：
这样就可以实现，表头强制一行且光标悬浮显示完整表头。

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/weixin_40725706/article/detail/117902