由于 DataGrid 遵循 react-table,我尝试在 DataGrid 中显示 subRows,如 this exmple 但表的每一行中的 subRows 或 getLeafRows 数组属性数组保持空数组 []。我认为 DataGrid 组件有问题! 我的代码是:
const items= useMemo(
() =>
data?.map((item) => ({
id: item.id,
name: item.name,
time: item.time,
subRows: parseStringToArray(data.children).map((child) => ({
id: child.id,
name: child.name,
time: child.time,
})),
})),
[data]
);
const onRow = useCallback<(row: Row<any>) => HTMLAttributes<HTMLTableRowElement>>((row) => {
return row.getCanExpand()
? {
onClick: row.getToggleExpandedHandler(),
style: { cursor: 'pointer' },
}
: {};
}, []);
const getRowCanExpand = useCallback<(row: Row<any>) => boolean>((row) => !!row.original.subRows?.length, []);
return(
<DataGrid
data: items || [],
columns: gridCols || [],
withRowExpanding: true,
getRowCanExpand,
renderSubComponent,
onRow,
withColumnFilters
withSorting
withFixedHeader
withPagination
highlightOnHover
height={1000}
pageSizes={['50', '100', '200']}
/>
)
如果你在这个概念上帮助我,我会很高兴。
我希望在数据网格中显示我的子行,就像数据网格中的另一行一样