element table表格渲染单层或者多层动态表头

渲染单层动态表头

 <el-table :data="tableData" border style="width: 100%" v-loading="loading">
     <el-table-column prop="month" label="月份"></el-table-column>
     <el-table-column v-for="(item,index) in arrLabel" :key="index" :label="arrLabel[index].name":prop="arrLabel[index].code"></el-table-column>
 </el-table>

需要一个头部的数组arrLabel：【】 数据的数组 tableData：【】

渲染多级动态表头

 <el-table :data="tableData" border style="width: 100%" v-loading="loading">
    <el-table-column prop="ks" label="科室"></el-table-column>
    <el-table-column v-for="(item,index) in arrLabel" :key="index" :label="arrLabel[index].name">
         <el-table-column v-if="item.children.length>0" v-for="(itemed,indexed) in item.children" :prop="itemed.key" :label="itemed.name">
             <template slot-scope="{row}">
                 <span>{{ row[itemed.key] }}</span>
             </template>
          </el-table-column>
          <template slot-scope="{row}" v-else>
               <span>{{ row[item.key] }}</span>
          </template>
    </el-table-column>
 </el-table>

根据后端返回的两组数组、经过循环渲染出动态多层单层表格
多层表头渲染时需要形成一个children 类型的数组