Vue路由器路由中的递归子段

Question

我正在建立一个包含组的网站，这些组可以有子组，而这些子组可以有子组，依此类推...

这有可能吗？

当然路线/groups/:slug/:slug之类的路径不起作用，因为它包含重复的参数。

我想到的是使用星形模式作为子路由，该子路由会将用户重定向到带有子段和子段的父路由，然后下一个动作是对子路径进行操作子弹（如果存在）。但是也许有人对此有更好的解决方案？

const groupRoute = {
    path: `/groups/:slug`,
    name: 'group',
    component: Group,
    children: [
        {
            path: '',
            component: GroupsHome
        },
        {
            path: '/subgroups',
            component: SubGroups
        },
        {
            path: '*',
            beforeEnter(to, from, next) {
                next({
                    name: 'group',
                    params: {
                        slug: to.params.slug,
                        subSlug: to.params.pathMatch
                    }
                })
            }
        },
    ]
}

Answer 1

Here is a basic example:

具有类似结构的嵌套对象的嵌套导航。这里的窍门是对内部路由使用不同的参数名称。