Thanks for taking the time to read, I'm trying to work out a data structure that would be used for navigation in a react app, I do have control over the data to loop through. The potential amount of children is unknown, I can't find a good way to loop through all of the data in one function, if you could point me in the direction I'm sure I can learn from it or any help would be great! Also if would be easier to add items to the data structure that is an option!
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
}
}