score:3

Accepted answer

so why can't you do something like:

const multilevel = ({multilevel}) => (
    <ul>
        {object.keys(multilevel).map(key => (<li key={key}>{key} /* etc*/</li>))}
    </ul>
);

{data.megamenu.map((menuitem, index) => (
    <li key={menuitem.name}>
        {menuitem.name}
        <ul>
            <li>multilevel
                <multilevel multilevel={menuitem.multilevel}/>
            </li>
        </ul>
    </li>
))}

that's a bit complex, and i advice you to separate your lists to different components to make code readable.

score:0

you need to loop through inner multilevels

{data.megamenu.map((menuitem, index) => (
    const innneritemsdom = menuitem.multilevel.map((item, index) =>{
       return <li>
                <ul>
                  <li>item.name</li>
                </ul>
              </li>
    })

    return <li> level1.2
     {innneritemsdom}
    </li>
))}

Related Query

More Query from same tag