el-table中动态渲染表头合并产生错行问题解决方式

2023-06-01 00:00:00 el

El-Table错行问题描述:

当一个页面有多个 el-table 时,即使不调用 doLayout (), 问题也能够处理,

给每一列增加唯一值来解决重复表格,数据刷新造成的问题。


原因:

列重复使用,但是不同表格有隐藏列,或者行,导致合并错误,产生错行


解决方式:

el-table-column 多增加一个不重复 key

:key = colKey + Math.random()


示例代码:

<el-table-column
            v-for="(item, colKey) in table.headers"
            :key="colKey + Math.random()"
            :width="item.width ? item.width : null"
            :label="item.label"
            :align="item.align ? item.align : null"
          >

相关文章