Javascript 如何使用JSX以编程方式呈现具有递归嵌套子级的文件树？

我试图以编程方式将其呈现为文件树，使用Material UI（react library）和文件夹结构。在第一次渲染期间，我不一定需要渲染所有子级

const folderStructure=[
{
名称：“AAA”，
节点类型：“项目”，
儿童：[
{
名称：“AAAA123”，
节点类型：“研究”，
儿童：[
{
名称：“ADAE.sas7bdat”，
节点类型：“文件”
}
]
}
]
},
{
名称：“BBB”，
节点类型：“项目”，
儿童：[
{
名称：“BB124”，
节点类型：“研究”
}
]
}
];

我正在手动呈现这些子项，为每个子项实例化一个StyledTreeItem，如下所示：

{structure.map（（el:IconFilterTreeNode，idx:number）=>{
返回(
{el？.children.map（（el2:IconFilterTreeNode，idx2:number）=>{
返回(
...
);
})}
);
})}

---

有没有一种有效的方法可以从第一个节点自动渲染子节点，而不必手动渲染嵌套的子节点？

我发现这个问题与此类似，因此，请在这里查看我的答案确实是我想要的，谢谢！如果你觉得它有用，请不要犹豫，给答案投赞成票：）我发现这个问题类似，所以，请在这里签出我的答案确实是我想要的，谢谢！如果你觉得它有用，请毫不犹豫地投票回答：）