el-table循环问题？

Question

如果后台传过来的数据是[{...},{...}],但是数组对象里的key和value都不是固定的，不能item.来取值，需要动态内容和表头，这种可以循环出来嘛，谢谢

Answer 1

可以通过 v-for 去循环 <el-table-column> 元素来实现这个效果。
比如说我这样：

<template v-for="termData in rootTermData.child">
  <h3 :key="termData.key">{{ termData.label }}</h3>
  <el-table :key="termData.key" :data="termData.data" border>
    <el-table-column
      v-for="(column, index) in termData.column"
      :key="column.key"
      :label="column.name"
      :prop="column.key"
      :align="!!index ? 'center' : 'left'"
    />
  </el-table>
</template>

我这边是连 <el-table> 元素数量都是不确定的所以就一起循环了。

只不过你需要提前把表头数据给全部组装出来。后端返回的时候不一定会愿意帮你组装好。