element官方文档给我们提供了一个column属性:show-overflow-tooltip="true"，意思是超出宽度内容会隐藏鼠标移动上去浮窗显示
案例展示：
不隐藏的话显得很臃肿，而且column会随内容变化高度很不美观
我们加入样式看看：
效果图：
这样就能把多余内容隐藏起来了。
隐藏el-table-column过多的内容并进行浮窗展示
2023-07-12
615
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《
阿里云开发者社区用户服务协议》和
《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写
侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
隐藏el-table-column过多的内容并进行浮窗展示
目录
相关文章
|
JavaScript
|
JavaScript
element-UI el-table动态显示隐藏列造成固定一侧的列(fixed=“left/right“)错误显示
问题原因：多个tabs共用一个实体，动态显示隐藏列 出现了固定在右侧的列(fixed="right")错位
【解决方案】
表格的重新布局，只要table数据发生变化的时候就重新渲染表格
```js
this.$nextTick(() => {
this.$refs.formname.doLayout()
})
```
参考element官方文档
错误显示](https://ucc.alicdn.com/j2ygdazy447va_20231030_1f039cb7584949959ea5987f1d84171c.png?x-oss-process=image/resize,h_160,m_lfit)
|
3月前
|
5月前
Element UI 【表格合计】el-table 实战范例 -- 添加单位，自定义计算逻辑
Element UI 【表格合计】el-table 实战范例 -- 添加单位，自定义计算逻辑
480
0
0
|
7月前
解决elementui中el-table表格首次expand展开不能正常渲染展开页面里面的表格内容
解决elementui中el-table表格首次expand展开不能正常渲染展开页面里面的表格内容
913
0
0
|
JavaScript
BI
el-table 多表格弹窗嵌套数据显示异常错乱问题
## 1、业务背景
使用vue+element开发报表功能时，需要列表上某列的超链接按钮弹窗展示，在弹窗的el-table列表某列中再次使用超链接按钮点开弹窗，以此类推多表格弹窗嵌套，本文以弹窗两次为例
最终效果如下示例页面
233
0
0
|
缓存
JavaScript
前端开发
el-table 列的动态显示与隐藏
当我们在对表格数据查看的时候，可能某些列的数据是当前想要重点关注的，而某些列并不需要展示出来，我们就可以通过对表格的列进行实时的一个切换去实现动态的显示与隐藏。
1188
0
0
热门文章
最新文章
1
跟阿里云技术专家阙寒一起深度了解视频直播CDN技术
2
流批一体的近实时数仓的思考与设计
3
丰富、连接、待集成—MaxCompute 生态再出发
4
securecrt克隆会话与sshd 的 MaxSessions
5
McAfee揭秘网络最危险搜索关键词
6
微软再爆IE 0day漏洞 绿盟科技提供预警及防护手段
7
uboot命令分析+实现【转】
8
读书笔记--101个shell脚本 之#11--炫
9
SQL Server 深入解析索引存储(堆)
10
OAF_EO系列3 - Initialize详解和实现（案例）
1
【claude官网中文版】国内如何使用claude?记住这十大技巧！
99
2
调用云端Qwen系列大模型（TURBO、PLUS、MAX和MAX_LATEST）在国际商业咨询智能体场景的实践探索
50
3
已解决：国内如何使用Claude 3.5 Sonnet \ claude官网中文入口
42
4
HarmonyOS 5.0 Next实战应用开发—‘我的家乡’【HarmonyOS Next华为公司完全自研的操作系统】
64
5
自学记录鸿蒙API 13：实现多目标识别Object Detection
158
6
《探索人工智能产业的可持续发展模式与策略》
18
7
《人工智能助力社会学研究：数据挖掘与分析方法的深度探索》
20
8
《软体机器人与仿生机器人的人工智能控制技术：挑战与突破》
18
9
《探索机器人自主导航与路径规划技术的热点》
20
10
《集成学习：堆叠泛化与提升法在人工智能中的应用热点》
16