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

前端  /  管理员 发布于 3年前   1635

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"
          >

完