现象:
多个tab下切换显示不用的表格数据,且表头是动态渲染的,当操作栏浮动时, 表格显示的位置不对
代码示例:
<template>
	<el-table
  :data="data"
  :key="toggleIndex"
  :row-class-name="rowClassName"
  :cell-class-name="cellClassName"
  :header-cell-style="{'text-align': 'center'}"
  @row-click="rowClick"
  border
  class="common-table-app"
  ref="table">
  <el-table-column
  	v-for="(column, index) in columnList" :key="index"
  	:label="column.label"
  	:prop="column.prop"
  	:align="column.align"
  	:width="column.width"
  	:min-width="column.minWidth"
  	:sortable="column.sortable">
  	<el-table-column
    v-if="column.children && column.children.length > 0"
    v-for="(columnChildren, indexChildren) in column.children" :key="`children-${index}-${indexChildren}`"
    :label="columnChildren.label"
    :prop="columnChildren.prop"
    :align="columnChildren.align"
    :width="columnChildren.width"
    :min-width="columnChildren.minWidth">
  	</el-table-column>
  </el-table-column>
	</el-table>
</template>解决办法:
1.给每个el-table-column设置不同的key,一般利用循环里的index,也可以:key="Math.random()"
2.解决表格闪烁问题
this.$nextTick(() => {
this.$refs.table.doLayout(); // 解决表格错位
});










