我目前正在为我的项目使用react-table库,并使用子组件函数来创建带有表的表。我的数据具有以下结构
[{GroupTitle: "Group Title 1",
ArrayItem:
[{SubTitle: "Sub1", ID: 1},
{SubTitle: "Sub2", ID: 1}]
},
{GroupTitle: "Group Title 2",
ArrayItem:
[{SubTitle: "Sub3", ID: 3},
{SubTitle: "Sub4", ID: 4}]
}
]
虽然我使用以下代码
<ReactTable
columns={[
{
accessor: "GroupTitle",
minWidth: 240,
},
{
header: "Subtitle",
minWidth: 240,
},
{
header: "ID",
minWidth: 240,
}
]}
SubComponent={row => {
return (
<ReactTable
data={row.original.ArrayItem}
columns={[
{ Header: "ID", accessor: "ID", id: "ID" },
{
accessor: "Title",
minWidth: 240
}
]}
/>
);
}}>
它工作得很好,我能够以一种分组的方式显示数据,但是我的问题是标题。我想要的是子组件的标题应该在顶部。并且顶部react-table(GroupTitle)不应具有标题。我可以通过使用accesso在父级中创建一个假标头来实现,但接下来的问题是如何对它们进行过滤?