vue ElementUI table 组件动态表头

页面展示从接口获取的数据到 table 里面，包括表头和表数据

html代码

<el-table :data="compareList"  border size="mini">
	<template v-for="(item,index) in tableHead">
		<el-table-column :prop="item.name" :label="item.label" :key="index"></el-table-column>
	</template>
</el-table>

接口获取的数据

this.tableHead = [
   	{ name: "id",label:"ID"},
    {name: "name",label:"名称"},
    {name: "type",label:"类型"},
    {name: "status",label:"状态"}
],
 	this.compareList = [{
    id: '1',
    name:'test1',
    type: '自定义',
    status: 'SUCCESS'
  },
  {
    id: '2',
    name:'test2',
    type: '自定义',
    status: 'RUNNING'
  },
  {
    id: '3',
    name:'test3',
    type: '自定义',
    status: 'FAILED'
}]

展示结果：