<el-table
style="width: 100%"
:data="getValues"
:show-header="false"
:cell-style="cellStyle"
border
>
<el-table-column
v-for="(item, index) in getHeaders"
:key="index"
:prop="item"
>
</el-table-column>
</el-table>
data () {
return {
headers: [
{
prop: 'date',
label: '先进企业',
},
{
prop: 'name',
label: '进步企业',
},
],
tableData: [
{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}
]
};
},
computed: {
getHeaders () {
return this.tableData.reduce((pre, cur, index) => pre.concat(`value${index}`), ['title'])
},
getValues () {
return this.headers.map(item => {
return this.tableData.reduce((pre, cur, index) => Object.assign(pre, { ['value' + index]: cur[item.prop] }), { 'title': item.label, });
});
}
},
cellStyle ({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
return "background:#f5f7fa;text-align: center;";
}
},