代码之家  ›  专栏  ›  技术社区  ›  DuckQueen

如何在JavaScript中创建嵌套菜单?

  •  0
  • DuckQueen  · 技术社区  · 7 年前

    enter image description here

    我们可以 set menu items

    const items = [
      { key: 'editorials', active: true, name: 'Editorials' },
      { key: 'review', name: 'Reviews' },
      { key: 'events', name: 'Upcoming Events' },
    ]
    //...
        <Menu vertical color='black' items={items}>
    
        </Menu>
    

    然而,我不知道如何筑巢。只需将项“content”设置为一些XML。

    如何创建包含多个嵌套部分的菜单 ReactJS\Semantic-UI 在JavaScript中?

    1 回复  |  直到 7 年前
        1
  •  1
  •   Andrei CACIO    7 年前

    1. <MenuContainer /> -&燃气轮机;我们的根组件

    2. <Menu></Menu> <Menu /> )或者 <Item /> 组成部分

    3. <Item></Item> -&燃气轮机;只能渲染 <li /> 或smth

    {
      label: 'Some menu',
      children: [{ label: 'Sub menu', children: [...] }, ...],
    }
    

    假设当我们在JSON中找到一个数组时,这意味着我们必须呈现一个菜单。如果我们有一个对象,我们渲染一个简单的子对象。粗略算法为:

    const MenuContainer = ({items}) => ({
       {items.map(item => item.items ? <Menu items={items} /> : <Item data={item} /> }
    });
    

    这是你要找的东西吗?