el-table prop属性是数组如何让表格对这个数组里面的属性进行多行展示
时间: 2024-01-21 17:18:30 浏览: 125
React Native之prop-types进行属性确认详解
如果要在 `el-table` 组件中展示一个数组的多行属性,可以使用 `scoped slot` 的方式来实现。
具体做法如下:
1. 在 `el-table-column` 组件中设置 `prop` 属性为数组的名称,例如 `prop="items"`。
2. 在 `el-table-column` 组件中设置 `scoped slot`,例如 `slot-scope="{ row }"`。
3. 在 `scoped slot` 中使用 `v-for` 循环遍历数组,例如:
```
<el-table-column prop="items" label="Items">
<template slot-scope="{ row }">
<div v-for="(item, index) in row.items" :key="index">
{{ item }}
</div>
</template>
</el-table-column>
```
这样就可以将数组的每个元素展示为表格中的一行。在上面的例子中,假设每个表格行的数据对象都有一个名为 `items` 的数组属性,那么这个数组中的每个元素就会被展示为一行。
阅读全文