1.结构
<el-table:data="tableData"border:height="700"style="width: 100% !important; overflow: auto":header-cell-style="{ background: '#becee1', color: '#333' }":cell-style="{ padding: '5px' }"><template v-for="item in tableHeader"><template v-if="item.children && item.children.length > 0"><el-table-column:key="item.id":label="item.label":prop="item.label"align="center"><span v-for="subItem in item.children" :key="subItem.id"><el-table-column:label="subItem.label":prop="subItem.prop"align="center"></el-table-column></span></el-table-column></template><el-table-columnv-else:key="item.id":label="item.label":prop="item.prop"align="center"></el-table-column></template></el-table>
2.数据
tableData: [{fenju: "杨浦分局",tianxie: "已填写",prop11: "11",prop12: "12",prop21: "21",prop22: "22",prop31: "31",prop32: "32"},{fenju: "长宁分局",tianxie: "未填写",prop11: "11",prop12: "12",prop21: "21",prop22: "22",prop31: "31",prop32: "32"}],tableHeader: [{label: "分局",prop: "fenju"},{label: "填写情况",prop: "tianxie"},{id: 1,label: "考核组1",prop: "",children: [{id: 11,label: "考核项1",prop: "prop11"},{id: 12,label: "考核项2",prop: "prop12"}]},{id: 2,label: "考核组2",prop: "",children: [{id: 21,label: "考核项1",prop: "prop21"},{id: 22,label: "考核项2",prop: "prop22"}]},{id: 3,label: "考核组3",prop: "",children: [{id: 11,label: "考核项1",prop: "prop31"},{id: 12,label: "考核项2",prop: "prop32"}]}]