element-ui使用el-table的展开行多次渲染bug

最新推荐文章于 2025-03-08 08:29:33 发布
最新推荐文章于 2025-03-08 08:29:33 发布
阅读量2.8k 收藏 2
点赞数
分类专栏： bug记录 文章标签： ui elementui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_43871182/article/details/122365231
版权

bug复现

el-table表格组件在使用type="expand"展开行效果时。如果你的el-table-column存在fixed属性（固定列效果），就会重复加载一遍展开行效果

解决办法（下策）

移除el-table-column存在fixed属性

更新

目前没有解决，
官方issues地址：https://github.com/ElemeFE/element/issues/12177

vue循环渲染element-ui中table内容
m0_60540878的博客
08-31 5116
当el-table元素中注入data对象数组后，在el-table-column中用prop属性来对应对象中的键名即可填入数据，用label属性来定义表格的列名。可以使用width属性来定义列宽。 相当于是要枚举出所有需要展示的参数，这种情况在参数比较少的情况下是比较方便的，但是在有很多数据或者参数不确定的情况下，这种枚举的方式就不太适合了。 <template> <el-table :data="tableData" style="width: 10
element-ui手风琴自定义html,使用element-ui table expand展开行实现手风琴效果
weixin_31935149的博客
06-15 1257
写这篇博客的初衷：官网演示效果为点击toggle，已经展开的项不会因为其他项展开而关闭，所以延伸了下，扩展为手风琴效果。效果前瞻：先删减一下代码：查看详情{{ props.row.name }}export default {data() {return {tableData5: [{id: '1',name: '好滋好味鸡蛋仔1',desc: '荷兰优质淡奶，奶香浓而不腻1',}, {id: '...
el-table fixed 固定列,expand展开行时内部组件重复渲染
weixin_66877481的博客
02-08 239
el-table fixed 固定列,expand展开行时内部组件重复渲染
记录封装el-table传入后台抓取的数据，再使用插槽导致表格列重复渲染问题
最新发布
qq2717449689的博客
03-08 297
在vue2项目中需要重复使用el-table，所以对el-table封装了一个全局组件使用:scTable.vue。
记录el-table 开启 列 fixed 后引发的内部组件重复渲染问题
Alexis_优快云的博客
12-04 2528
el-table对于列的居左、居右（即）功能实现 采用的方式是将多个el-table进行拼凑，也就是说设置了居左、居右后，将出现三个el-table, 分别为 【居左】、【中间滚动区域】、【居右】 的el-table拼凑出浮动功能。这将可能引起重复渲染组件带来的bug。此文章将记录在此背景下的两个需求引发的问题及解决方案。
elementUI中table组件expand会渲染两次的bug
jikangjian的博客
11-07 3931
<el-table>中的expand模板中嵌套一个table，这个table会被渲染两次 父组件table里面具有fixed属性的table会这样，请删掉它 ,找了一下午 ,才发现接口请求两次的罪魁祸首 ...
el-table中expand行展开内容渲染两次，重复请求
weixin_55254452的博客
08-15 439
el-table的行展开内容重复渲染两遍
element使用type=“expand“出现数据多次渲染bug
weixin_55798503的博客
10-13 636
移除el-table-column存在fixed属性。
Element-UI el-table-column 使用slot插槽v-if数据更新后没有渲染
qq_53120043的博客
09-27 1520
Element-UI el-table-column 使用slot插槽v-if数据更新后没有渲染
Element-UI Table组件上添加列拖拽效果实现方法
08-27
在模板部分，我们使用 `el-table` 组件来渲染表格，并使用 `el-table-column` 组件来渲染表头。我们还添加了一个 `dragState` 对象来记录拖动状态。 拖动状态 在记录拖动状态时，我们需要记录几个关键参数，包括...
Element-UI升级引发el-table空白问题及备份包资源介绍
在使用Element-UI的过程中，有时会因为版本升级导致的兼容性问题或者代码调整导致的bug，影响到组件的功能，例如el-table在升级后不显示内容，页面一片空白。 在解决el-table不显示的问题之前，需要了解Element-UI...
自定义指令directives:防抖,节流,element-ui的无限滚动在el-table上使用的封装
叮当的猫猫的博客
07-13 1500
然而，有的情况下，你仍然需要对普通 DOM 元素进行底层操作，这时候就会用到自定义指令，3.update：所在组件的vnode更新时调用，但是可能发生在其子vnode更新之前，指令的值可能发生了改变，也可能没有，但是你可以通过比较更新前后的值来忽略不必要的模板更新。1.bind:只调用一次，指令第一次绑定到元素时调用，在这里可以进行一次性的初始化设置。2.局部注册，在用到的组件内注册并使用，使用如上，下面局部注册引用。2.局部注册，在用到的组件内注册并使用，使用如上，下面局部注册引用。
vue+element 导出表格使用el-table的fixed属性,导致数据重复
聆听
07-13 2054
分析：我使用了el-table的fixed属性来让某一列固定，但elementui的实现方式是：创建了两个tabledom，通过一个隐藏一个显示来实现交互效果。当我导出整个el-table 就会将两个div内的table都导出，导致数据重复。 //导出 export2excel () { /* '#export2excel '关联导出的dom节点 */ var fix = document.querySelector('.el-table__fixed'); // 判断要导出的节
vue element ui 使用el-table 组件的时候，列使用fixed，表格滚动后出现错位
weixin_42539372的博客
04-17 9154
表格滚动之后fixed列和其他列出现如下错位的情况 在网上找了很多办法，doLayout也不起作用，给column设置：key="index+Math.random()"也不起作用,然后就用监听滚动条的方法写了： this.dom = this.$refs.multipleTable.bodyWrapper console.log(this.dom) this.dom.addEven...
elementUI中table组件固定列时会渲染两次模板内容问题
幸运小男神的博客
07-04 974
查阅资料发现，elementUI的固定列的实现原理是将两个表格拼装而成，因此获取的对象也是两个。对于需要使用对象的方法的，可以使用for循环逐个调用方法，或者调整业务将固定列的需求删除。今天在使用elementUI的table组件时，由于业务需要固定表格的前几项列，然后获取表格对象时发现竟然有两个对象。
el-table表格导出（解决fixed导致的重复渲染dom问题）
旺仔小牛奶
12-25 626
导出表格时解决fixed导致的重复渲染dom问题
vue采坑日记， el-table内包含子组件，配合使用固定列 fixed 属性 导致的问题。
徐林的博客
07-31 1997
问题说明：在使用table组件时，内嵌了子组件做行修改，然后配合了fixed属性做列固定，结果导致了只要新增或者删除行，子组件就会连续渲染三次，如果有多行，就会行数x3的重复渲染。 这个BUG找了好久，采坑分享的也不多。 目前还没有找到解决办法，只能先去掉 fixed。 ...
el-table表格中第一列合并和第二列expand展开行同时使用的解决办法
weixin_70486077的博客
05-15 1236
但是展开后，在原来的循环打印的索引基础上又多了五次记录，但是我的表格展开并没有改变原本el-table绑定的data数据，有点搞不懂这个合并表格的循环逻辑，看了一下expand展开是在展开行后面同级下面添加了一个行元素，没有过多的去深究，下面贴上解决办法。在我使用el-table的时候，遇到了一个问题，就是el-table的合并和展开似乎不能同时使用，会出现一些奇奇怪怪的bug导致不能正常显示。
element表格内组件执行多次的原因以及解决方法
我是小奶音啊的博客
01-24 4062
如图: table表格里引用了自己封装的select组件，但是子组件在created里总是执行两次(因为我在created里请求接口了),后来发现是表格里写了fixed的缘故,fixed会让表格重新复制一遍，这样就相当于加载了两次表格的dom，所以子組件才会执行两遍 fixed复制可以查看我的另一篇博客,讲的相对细致https://blog.youkuaiyun.com/weixin_44157964/article/details/120205080 解决方法: 如果fixed没有用到的话,可以去掉fixed 如
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值