element-ui的el-tabel组件怎么使用type=“expand”实现表格嵌套并且在子表格没有数据的时候隐藏展开按钮
效果如下:

试过很多种办法,思路都在怎么控制<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;
}
element-ui的el-tabel组件怎么使用type=“expand”实现表格嵌套并且在子表格没有数据的时候隐藏展开按钮的更多相关文章
- Element ui 上传文件组件(单文件上传) 点击提交 没反应
element ui 第一次上传文件后 上传其他文件再次点击不再次提交 需要使用 clearFiles 清空已上传文件列表 这时候在次点击 上传按钮 就会惊喜的发现 可以上传了使用方法 this.$r ...
- Element ui 中使用table组件实现分页记忆选中
我们再用vue和element-ui,或者其他的表格的时候,可能需要能记忆翻页勾选,那么实现以下几个方法就ok了 示例如下 <el-table :data="tableData&quo ...
- Vue + Element UI 实现权限管理系统 前端篇(十五):嵌套外部网页
嵌套外部网页 在有些时候,我们需要在我们的内容栏主区域显示外部网页.如查看服务端提供的SQL监控页面,接口文档页面等. 这个时候就要求我们的导航菜单能够解析嵌套网页的URL,并根据URL路由到相应的嵌 ...
- 基于element ui的级联选择器组件实现的分类后台接口
今天在做资产管理系统的时候遇到一个分类的级联选择器,前端是用的element的组件,需要后台提供接口支持. 这个组件需要传入的数据结构大概是这样的,详细的可参考官方案例: [{ value: ...
- Vue+Element UI 实现视频上传
一.前言 项目中需要提供一个视频介绍,使用户能够快速.方便的了解如何使用产品以及注意事项. 前台使用Vue+Element UI中的el-upload组件实现视频上传及进度条展示,后台提供视频上传AP ...
- element UI table 过滤 筛选问题
一.问提描述 使用elementUI table 官方筛选案例,发现筛选不是服务器端筛选,而是浏览器端对每一页进行单独筛选. 如何在服务器端筛选? 二.查询Element UI 官网table组 ...
- 关于Element UI中页面样式小问题
一,修改组件dialog窗口的大小 二,在我使用upload组件上传一张美女图片时,发现当预览图片时,图片是灰色的,点击一下才会变亮,这种效果使我很不舒服,于是我通过添加下面的一条样式,问题解决了(可 ...
- Vue+element ui table 导出到excel
需求: Vue+element UI table下的根据搜索条件导出当前所有数据 参考: https://blog.csdn.net/u010427666/article/details/792081 ...
- 封装Vue Element的upload上传组件
本来昨天就想分享封装的这个upload组件,结果刚写了两句话,就被边上的同事给偷窥上了,于是在我全神贯注地写分享的时候他就神不知鬼不觉地突然移动到我身边,腆着脸问我在干啥呢.卧槽你妈,当场就把我吓了一 ...
随机推荐
- android SearchView和ListView简单使用
其实我写代码最担心遇到关于适配器的使用,在我的感觉中适配器是个难度很大的知识点,但是不能因为难而不去学习啊,毕竟现在时间很充裕,可以慢慢学,所以,不会也要写,真所谓,迎难而上啊. 下面是Search ...
- PHP接收http请求头信息
1.PHP 自带函数 getallheaders() 目前 getallheaders() 只能用于 apache 中.如果想在 nginx 中也能使用,可以使用自定义函数. foreach (get ...
- 【转载】vue.js实现格式化时间并每秒更新显示功能示例
引用:https://www.jb51.net/article/143351.htm 这篇文章主要介绍了vue.js实现格式化时间并每秒更新显示功能,结合实例形式分析了vue.js时间格式化显示与基于 ...
- 百度知道芝麻将,申请资格&权限介绍&奖惩制度(简剖)
芝麻将,即百度知道管理员.不及掌握,了解下也是好的. 知道圈子,把注册用户,成为芝麻.一般用户,即小芝麻.芝麻将,就是咱们说的知道管理员. 申请. 芝麻将,申请条件不是很难,难的是后续维护,申请前考虑 ...
- scala成长之路(6)函数入门
众所周知,scala作为一门极客型的函数式编程语言,支持的特性包括: 函数拥有“一等公民”身份: 支持匿名函数(函数字面量) 支持高阶函数 支持闭包 部分应用函数 柯里化 首先需要指出,在scala中 ...
- 8-C++远征之继承篇-学习笔记
C++远征之继承篇 开篇介绍 整个C++远征计划: 起航->离港->封装->继承 为什么要用继承? 为什么要有继承? 如何来定义基类 <----> 派生类? 基类到派生类 ...
- R语言绘图:时间序列分析
ggplot2绘制 arima诊断图 library(ggfortify) autoplot(acf(gold[,2], plot = FALSE)) ggtsdiag(auto.arima(gold ...
- webDriver + Firefox 浏览器 完美兼容
搞java最烦的就是不同版本的适配问题.现分享下实测成功的案例. Firefox:4.0.1 selenium:selenium-server-standalone-2.43.1.jar 下面这个链接 ...
- KMP算法(查找子序列)
KMP类似暴力,但是不会和暴力完全一样,回溯到起点. 简单的说 假如 模板链字符串是: abcabcabcabd 寻找abcabd 在模板链出现的次数,并且输出该次数 ...
- MVC中路由的修改和浏览器的地址参数
在 ASP.NET MVC 应用程序中,它是更常见的做法在作为路由数据 (像我们一样与身份证上面) 比将它们作为查询字符串传递的参数中传递. ) { return HttpUtility.HtmlEn ...