问题:elementUI el-table 设置了高度height 和合计行 show-summary 之后,合计行无法正常显示

一、问题分析

  根据调试,发现该问题应该属于组件bug,表格主体中给 footer留的高度不够导致,重新设置即可。

二、解决方法

  添加生命周期钩子 updated ,对 table 组件重新布局即可解决问题。具体如下:

  

    <el-table
show-summary
border
ref="table"
:data="dataList"
:height="tableHeight"
:summary-method="getSummaries"
>

  

updated() {
this.$nextTick(() => {
this.$refs.table.doLayout()
})
}

以上,问题即可解决

 

解决elementUI 表格el-table设置高度之后合计行不显示的更多相关文章

  1. NC nc5.x报表设置合计行是否显示

    首先要先继承UI类 /** * 设置合计行是否显示 */ public TotalsReportUI() { super(); getReportBase().getBodyPanel().setTo ...

  2. vue + ElementUI 表格筛选框的高度设置,超出一定高度,显示滚动条

    相信有很多小伙伴遇到过这个问题,首先还是来看图片,筛选框我做了处理,所以和官网的有点小差别 官方网站和个人网站对比图如下: 代码如下:(F12找到该元素的class,设置高度) .el-table-f ...

  3. 解决element-ui表格表头内容太长时的换行问题

    在用vue+element-ui做一个后台管理系统时,遇到这样的问题, 如图: 使用el-table做一个表格,当表头内容过长时会换行,在不设置的宽度的时候每一列的宽度是等比例分配的,虽然elemen ...

  4. 解决element-ui表格字段用expand展开行时其他字段也会同时展开的问题

    使用element-ui的table表格时,我们通常会在需要展开的列上通过设置 type="expand" 和 Scoped slot 可以开启展开行功能,但是渲染结果会出现其他未 ...

  5. 解决element-ui表格多重嵌套循环时,添加row-key="id" 出现Duplicate keys detected: 'XXX' 错误的问题

    Duplicate keys detected: 'XXX' 错误,怀疑是多重嵌套循环时 :key="item.id或index" 不能重复的问题,但设置了不同的 key 后并未解 ...

  6. div没有设置高度时背景颜色不显示(浮动)

    在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度,在IE浏览器下显示正常.但是使用Firefox/opera浏览时却出现最外层Div的背景颜色和边框不起作用的问题. ...

  7. 解决 asp.net 伪静态 IIS设置后 直正HTML无法显示的问题

    asp.net+UrlRewriter来实现网站伪静态,实现伪静态有一些好处,比如对于搜索引擎更好收录页面,还有一个好处就是隐藏了真实地址的参数,所以有独立服务器的朋友,配置IIS实现伪静态功能,挺不 ...

  8. HTML+css基础 表格标签table Table标签属性 td标签属性

    表格标签table:   他是由行与列构成,最小单位是单元格. 行标签  <tr></tr> 单元格标签<td></td> Table标签属性: Bor ...

  9. 解决react使用antd table组件固定表头后,表头和表体列不对齐以及配置fixed固定左右侧后行高度不对齐

    一.固定表头后表体列和表头不对齐 此问题可能在antd3.24.0版本之前都存在,反正3.16.2版本是存在这个问题的,如果是3.24.0之前的版本估计只能通过修改css样式解决. 按照官网说的: 1 ...

  10. 关于html中table表格tr,td的高度和宽度

    关于html中table表格tr,td的高度和宽度 关于html中table表格tr,td的高度和宽度 做网页的时候经常会遇到各种各样的问题,经常遇到的一个就是会碰到表格宽度对不齐的问题.首先,来分析 ...

随机推荐

  1. 洛谷P1020

    又是一道做的很麻的题,准确来说感觉这不是一道很好的dfs题,没有体现dfs的一些特点 反而感觉是在考察dp,刚开始也是按照我的思路交了3次都没过 原本以为所选的数应该都是由上一次的最大值推出来的,后面 ...

  2. 使用gzexe加密shell脚本

    使用 gzexe 加密 shell 脚本是一个相对简单的过程.以下是具体的步骤: 编写你的 shell 脚本:首先,你需要有一个 shell 脚本文件,比如 myscript.sh. 确保脚本可执行: ...

  3. 【解决方案】智能UI自动化测试

    你的UI自动化追得上业务的变更和UI更迭吗?当今瞬息万变的时代,成千上万的App围绕着现代人生活的点点滴滴.为了满足用户的好的体验和时刻的新鲜感,这些App需要时刻保持变化,也给 UI自动化落地实施带 ...

  4. SCSS与CSS的区别

    SCSS(Sassy CSS)是一种CSS预处理器,它扩展了CSS的功能,并为样式表的编写提供了额外的便利性.以下是两者之间的主要区别: 1. 语法扩展:           CSS标准层叠样式表语言 ...

  5. TP5.0学习笔记

    TP5目录结构介绍 application目录是应用目录,我们整个应用所有的内容都写在这个目录中,在后续开发中,我们更多的时候都是在编写这个目录中的文件.在它里边有一个index文件夹,它叫做模块儿, ...

  6. oeasy 教您玩转 linux 010214 画面转文字 asciiview

  7. Vue export & export default & import 总结

    Vue export & export default & import 总结 by:授客 QQ:1033553122 1.   实践环境 Vue 2.9.6 2.   简介 在ES6 ...

  8. hive导入mysql

    hive测试--HIVE数据分析02 题目: 4.处理结果入库:(在虚拟机安装mysql)    将上述统计分析的结果数据保存到mySQL数据库中. #text3_1入库 #1.添加驱动,在hive的 ...

  9. ambari+ bigtop 编译、打包、部署步骤总览

    1 ambari + bigtop 构建大数据基础平台 1.1 参考: 1.2 参考 amabri bigtop 打包部署 2 ambari+bigtop编译.打包.部署 2.0 基础环境准备 2.1 ...

  10. “refer to”和“refer to as”在英语中的用法有所不同

    "refer to"和"refer to as"在英语中的用法有所不同,具体区别如下: Refer to "Refer to"意为" ...