vue数据接口展示,这样的数据应该怎么在表格展示?表头的名称也是用数据里面的。有点懵。
数据是carry/not_carry展示
[
{
"carry": 0,
"not_carry": 12,
"code": "002",
"name": "花地瑪油站"
},
{
"carry": 0,
"not_carry": 18,
"code": "003",
"name": "北安油站"
},
{
"carry": 0,
"not_carry": 18,
"code": "004",
"name": "濠江油站"
},
{
"carry": 0,
"not_carry": 24,
"code": "005",
"name": "氹仔油站"
},
{
"carry": 0,
"not_carry": 18,
"code": "006",
"name": "東華油站"
},
{
"carry": 0,
"not_carry": 6,
"code": "007",
"name": "機場油站"
},
{
"carry": 0,
"not_carry": 18,
"code": "008",
"name": "南華油站"
},
{
"carry": 0,
"not_carry": 30,
"code": "009",
"name": "筷子基油站"
},
{
"carry": 2,
"not_carry": 30,
"code": "010",
"name": "蓮花加油站"
}
]
如果是用table,就用v-for循环tr
如果用elementUI的el-table,就把数组赋给el-table的data
https://element.eleme.cn/#/zh-CN/component/table
v-for循环data数据进行绑定
```html
<table>
<thead>
<tr>
<th v-for="(item,i) in data" :key="i">{{item.name}}</th>
</tr>
</thead>
<tbody>
<tr v-for="(item,i) in data" :key="i">
<td>{{...}}</td>//内容需要什么取什么
.......
</tr>
</tbody>
</table>
```