vue+element-ui项目中 table表格 实现多级，动态表头 + table数据刷新问题

问题一：公司项目系统，新增需求，需要合并表头，且未合并表头并不固定（例：数据一，数据二），展示如下：

即红色标记部分，会根据接口数据返回，动态变化

代码 如下

<template>
  <div id="app">
    <el-table :data="reports.items">
      <el-table-column label="日期" prop="branch" />
      <el-table-column
        v-for="(bank, index) in reports.banks"
        :key="bank"
        :label="bank"
      >
        <el-table-column :prop="`${index}_0`" label="消费"></el-table-column>
        <el-table-column :prop="`${index}_1`" label="实际消费"></el-table-column>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      reports: {
        banks: ["data1", "data2"],
        items: [
          { branch: "2021/3/1", "0_0": 50, "0_1": 40, "1_0": 30, "1_1": 20 },
          { branch: "2021/3/2", "0_0": 40, "0_1": 30, "1_0": 20, "1_1": 10 }
        ]
      }
    };
  }
};
</script>

问题二：改造数据 后，给table赋值，发现表格没有熟刷新；

 给table加上 :key='Math.random()'就可以了