Codesandbox example
您只需递归调用Menu组件以显示其子项,并将其作为数据道具传递.
let data = [
{
title: "Top level 1",
slug: "top-level-1",
children: [
{
title: "Sub level 1",
slug: "sub-level-1",
children: [
{
title: "Sub Sub Level 1",
slug: "sub-sub-level-1",
children: [
{
title: "Sub Sub Level 2",
slug: "sub-sub-level-2"
}
]
}
]
},
{
title: "Sub level 2",
slug: "sub-level-2"
}
]
},
{
title: "Top level 2",
slug: "top-level 2"
}
];
const Menu = ({data}) => {
return (
{data.map(m => {
return (
{m.title}
{m.children &&
});})}
);
}
const App = () => (
Start editing to see some magic happen {'\u2728'}
);