Children in children not working

[steptro]

Children inside children does not seem to be working. I'm using the following sidebar configuration

[
    {
        "title": "name",
        "children": [
            {
                "title": "item 1",
                "link": "#"
            },
            {
                "title": "item 2",
                "link": "#"
            },
            {
                "title": "another list",
                "children": [
                    {
                        "title": "item 3",
                        "link": "#"
                    }
                ]
            }
        ]
    }
]

When using this sidebar configuration, I get the following error:

When I remove the item with the children it works as expected.

[zakrzk]

Same here, is there any other way to implement multi-level menu?

[steptro]

The problem is that SideBarItem cannot have any children. See https://github.com/egoist/docute/blob/master/src/components/SidebarItem.vue#L37-L52.

This could probably be fixed by adding a SideBarItem if it detects that the item has children:

<div
      class="ItemChildren"
      v-if="children && (open || item.collapsable === false)"
    >

      <div class="ItemChild" v-for="(link, index) of children" :key="index">
        ...

        <sidebar-item
          v-if="link.children"
          :item="link"
          :open="closedItems.indexOf(index) === -1"
          @toggle="toggleItem(index)"
        />
      </div>
    </div>