使用element-ui的table表格时,我们通常会在需要展开的列上通过设置 type="expand" 和 Scoped slot 可以开启展开行功能,但是渲染结果会出现其他未加type="expand"属性的字段也会同时自动添加展开行的符号,点开后内容为空,现象如下:

黑马教程的做法是把element-ui版本降到2.4.5,但是很显然这种办法会让人很不爽,然后试图升级element-ui最新版本后依然如此,其实解决方法非常简单,就是在其他不需要展开的列上添加 type="" 即可。

解决element-ui表格字段用expand展开行时其他字段也会同时展开的问题的更多相关文章

  1. element ui 表格提交时获取所有选中的checkbox的数据

    <el-table ref="multipleTable" :data="appList" @selection-change="changeF ...

  2. 解决Vue的表格中,expand只有某些行需要展开的问题。

    element UI里的表格里,type="expand"的话,所有行都有展开的选项,然而实际中有些行根据判断不需要展开,而element目前对这个问题还不是很友好,现在有个可以通 ...

  3. vue + element ui 表格自定义表头,提供线上demo

    前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ...

  4. 封装一个优雅的element ui表格组件

    现在做后台系统用vue + elementUI 的越来越多,那element ui的 el-table 组件肯定也离不开.虽然element ui的table组件很好.但是表格和分页是分离的.每次写表 ...

  5. Element UI表格组件技巧:如何简洁实现跨页勾选、跨页统计功能

    业务场景 在使用Element UI的Table组件时,常常面对这样的业务需求: 表格数据的每一项都要提供勾选框,当切换分页时,能够记忆所有页面勾选的数据,以实现批量提交不同页面勾选数据的功能.并且, ...

  6. vue2.0+Element UI 表格前端分页和后端分页

    之前写过一篇博客,当时对element ui框架还不太了解,分页组件用 html + css 自己写的,比较麻烦,而且只提到了后端分页 (见 https://www.cnblogs.com/zdd20 ...

  7. element UI表格行高、padding等设置报错问题

    element UI里面表格的行高需要自己调整高度和设置padding,直接写style是不行的,里面有 : 1.row-style (行的 style) 2.header-row-styl   (表 ...

  8. element ui表格表头顺序错乱的问题

    因为在项目中两个表格共用了同一个组件, 但由于表头不完全相同, 就通过v-if来控制表头的显示隐藏,没想到造成了表头顺序的错乱, 经过多方查找资料,最后找到了解决方法: 即为每一列el-table-c ...

  9. element ui表格实现单选 但是单选取消会报错

    1.在el-table中添加两个事件  @selection-change="handleSelectionChange"  @current-change="choos ...

  10. Element ui表格展示多张图片问题

    显示一张图片的方法: <el-table-column label="头像" width="100"> <template scope=&qu ...

随机推荐

  1. [转载] MATLAB | RGB image representation

    转载自https://www.geeksforgeeks.org/matlab-rgb-image-representation/ MATLAB | RGB image representation ...

  2. docker 操作常用命令

    镜像 #以tomcat为基础镜像创建一个容器,容器名为my-tomcat #拉取tomcat最新镜像,实际生产中,docker pull 这一步可以省略,docker run的时候会自己去拉取. do ...

  3. AutoCAD专用卸载工具,完美彻底卸载清除干净AutoCAD各种残留注册表和文件。

    AutoCAD专用卸载工具,完全彻底卸载删除干净AutoCAD各种残留注册表和文件的方法和步骤.如何卸载AutoCAD呢?有很多同学想把AutoCAD卸载后重新安装,但是发现AutoCAD安装到一半就 ...

  4. nginx,git,maven面试题

    1.简述一下什么是Nginx,它有什么优势和功能? Nginx是一个web服务器和方向代理服务器,用于HTTP.HTTPS.SMTP.POP3和IMAP协议.因 它的稳定性.丰富的功能集.示例配置文件 ...

  5. unity VideoPlayer 视频静音

    standVideo.SetDirectAudioMute(0,true);

  6. [Oracle19C ASM管理] 安装和配置ASM以及Oracle数据库

    一般设置 关闭防火墙 检查防火墙状态 systemctl status firewalld.service 暂时关闭防火墙,下次启动时防火墙仍随系统启动而启动 systemctl stop firew ...

  7. js 自定义可编辑table并获取输入值

    1.js加载table,tabid为abc. jsp: <table id="abc"></table> js:var tr_tr = "&quo ...

  8. STP协议-进阶

    一 STP的选举规则1.在交换网络中选举一个根桥(Root Bridge)比较Bridge ID桥ID(优先级+MAC地址)越小越优 为了确保交换网络的稳定,建议提前规划STP组网,并将规划为根桥的交 ...

  9. CSS 属性大全

    css常用标签大全 一.字体属性:(font) 大小 font-size: x-large;(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX.PD 样式 font-s ...

  10. C语言学习--指针函数与函数指针

    #include<stdio.h> #include<string.h> //指针函数: 是一个函数, 但是这个函数的返回值类型是一个指针 //函数指针: 是一个指针, 这个指 ...