构建数据结构以遍历嵌套的子级

Question

感谢您花时间阅读，我正在尝试制定一个用于在 React 应用程序中导航的数据结构，我确实可以控制要循环的数据。 潜在的孩子数量是未知的，我找不到一种在一个函数中循环遍历所有数据的好方法，如果你能指出我的方向，我相信我可以从中学习，或者任何帮助都会很棒！ 此外，如果将项目添加到数据结构中会更容易，这是一个选项！

 const data = { "nav": { "Nav Menu Title 1" : { "children": [ { "name": "Sub Menu Title 1", "children" : [ { "name": "Sub Sub Menu Title 1", "children" : [ { "name": "Sub Sub Menu Option 1" } ] }, { "name" : "Sub Menu Option 1" } ] }, { "name": "Option 1" }, { "name": "Option 2" }, { "name": "Option 3" }, { "name": "Option 4" }, { "name": "Option 5" } ] } } } for (let items in data.nav) { let newNavItem = { id: 'apps.' + items, title: items, type: 'item', icon: 'heroicons-outline:shopping-cart' } if (data.nav[items].children.length > 0) { newNavItem.type = "collapse"; newNavItem.children = []; // this is where I have trouble looping through children to add in a newNavItem } }