el-table-column 里面套 el-table
时间: 2023-11-30 11:03:00 浏览: 102
el-table无限滚动+控制列是否显示+列排序(非json)
5星 · 资源好评率100%
根据提供的引用内容,el-table-column是一个Vue组件,用于定义el-table中的列。而el-table是一个基于Element UI的表格组件。因此,el-table-column是用于定义el-table中的列的组件,而不是用于嵌套el-table的组件。如果您想要在el-table中嵌套另一个el-table,可以在el-table-column的slot中使用el-table组件。
以下是一个示例代码,展示了如何在el-table-column中嵌套el-table组件:
```html
<template>
<el-table :data="tableData">
<el-table-column prop="name" label="Name">
<template slot-scope="scope">
<el-table :data="scope.row.children">
<el-table-column prop="childName" label="Child Name"></el-table-column>
</el-table>
</template>
</el-table-column>
</el-table>
</template>
<script>
export default {
data() {
return {
tableData: [
{
name: 'Parent 1',
children: [
{
childName: 'Child 1-1'
},
{
childName: 'Child 1-2'
}
]
},
{
name: 'Parent 2',
children: [
{
childName: 'Child 2-1'
},
{
childName: 'Child 2-2'
}
]
}
]
};
}
};
</script>
```
在上面的示例中,我们在el-table-column的slot中使用了el-table组件,并将其绑定到了当前行的children属性。然后,我们在el-table中定义了一个el-table-column,用于显示子项的名称。
阅读全文