博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
element-ui的el-tabel组件怎么使用type=“expand”实现表格嵌套并且在子表格没有数据的时候隐藏展开按钮...
阅读量:7104 次
发布时间:2019-06-28

本文共 516 字,大约阅读时间需要 1 分钟。

效果如下:

 

试过很多种办法,思路都在怎么控制<el-table-column type="expand">里面的type上,比如使用v-show等等,但是发现,要不就是展开图标全部没有,要不就是全部有,研究好久,终于想出来这么个办法:

使用getRowClass针对每一行添加类,

getRowClass(row, index) {    let res = []    if (!row.children)//即改行没有子元素时,添加row-expand-cover类      res.push('row-expand-cover')    /* if (row.operate == 2)      res.push('hide-row')    return res.join(' ') */  }

然后设置该类的样式,把没有子元素的行的expand图标隐藏:

.row-expand-cover .el-table__expand-column .el-icon{
visibility:hidden;}

 

转载于:https://www.cnblogs.com/XHappyness/p/7413051.html

你可能感兴趣的文章
JVM笔记 | Java垃圾回收(GC)
查看>>
(译)一个完整的Django入门指南---第7部分
查看>>
树莓派入门到放弃
查看>>
区块链技术公司 聊区块链与AI结合
查看>>
微服务场景下性能问题排查神器之xrebel
查看>>
微信小程序input组件type属性3个值的作用
查看>>
QQ 机器人平台 Newbe.Mahua 2.1 支持 Websocket
查看>>
【监控文件夹并将增加和删除的文件列表发送邮件完美脚本】-未来星开发开发团队...
查看>>
AndroidStudio无法输出日志的Bug
查看>>
TypeScript基础入门 - 接口 - 函数类型
查看>>
lombok_学习_00_资源帖
查看>>
搜集用 LLVM 创造动态语言的例子
查看>>
第159天:前端知识体系框架
查看>>
Spring AOP注解为什么失效?90%Java程序员不知道
查看>>
Json学习
查看>>
Airbnb: React Native 从选择到放弃
查看>>
Eclipse中Tomcat配置问题
查看>>
Linux下使用split按行数进行切割
查看>>
盘点2015年英特尔旧金山IDF峰会上的黑科技
查看>>
SQL性能优化
查看>>