question: why is the data design like this? it's obviously wrong.

data:

let list = [
    {title: '', detail: ''},
    {title: '', detail: ''},
];

idea:
1. Integrate the header after getting the data

let columnData = list.map(item => ({
  prop: item.title,
  label: item.title
}));

2. Extract data (field name is header)

let dataSource = list.reduce((data, record) => {
  data[record.title] = record.detail;
  return data;
}, {});
dataSource = [dataSource];

3. Modify el-table-column

<el-table-column
  v-for="column in columnData"
  :prop="column.prop"
  :label="column.label"
></el-table-column>

4, effect

the same floor asks why the data design is like this, obviously wrong.