DataTable 支持树形数据表格功能. 只要给DataTable设置了getSubRows属性便启用了树形表格.
tip: 树形表格和数据分组不能同时启用.
理论上树可以有无限层级. 但建议不超过三级为佳.
数据源应该具有层级结构. 如果是id-parentId型的平面数据, 可以使用@rtdui/core包中的flatToTree工具方法转换为层级结构. 层级结构如:
[
{
id: 1,
children: [
{
id: 11,
children: [
{
id: 111,
},
],
},
],
},
{
id: 2,
children: [
{
id: 22,
children: [{ id: 222 }],
},
],
},
];
其中: children字段可以是任意字段名. 只要在getSubRows正确指定即可.
getSubRows属性是一个方法, 用于指定如何访问数据源中的孩子属性. 参数一个row对象参数. 如:
<DataTable getSubRows={(row) => row.children} />
在列定义中对于展开列定义meta.expandable为true(如果存在多个列则只有第一个有效), 用于指定可展开的列.
{
id: "姓名",
header: "姓名",
accessorKey: "fullName",
size: 180,
meta: {
expandable: true,
},
},
树形表格导出的行为是展开到哪就导出到哪. 也就是说未展开的行不会被导出.
ID | 姓名 | 年龄 |
|---|---|---|
| 无数据 | ||