首页 > 解决方案 > 子路由未显示在 vuejs 中

问题描述

子路由未显示在 vuejs 中。

访问子路由时,会显示母路由。我究竟做错了什么?

{
    path: '/portaria',
    name: 'portaria',
    component: Portaria,
    meta: {
        auth: true,
        layout: layouts.navTop,
        tipo: 'portaria'
    },
    children: [
        {   path: 'create',
            name: 'create',
            component: PortariaCreate,
            meta: {
                auth: true,
                layout: layouts.navTop
            }
        }
    ]
}

标签: javascriptvue.jsvuejs2vue-router

解决方案


当它在儿童内部时,您缺少 / 。它是{path:'create'...,它应该{path: '/create'...在孩子里面。

像这样:

const router = new Router({
    mode: 'history',
    //base: '/sub-path/',
    routes: [
        {
            path: '/',
            alias: '/dashboard',
            name: 'dashboard',
            component: Dashboard,
            meta: {
                auth: true,
                layout: layouts.navLeft,
                searchable: true
            }
        },
        {

            path: '/portaria',
            name: 'portaria',
            component: Portaria,
            meta: {
                auth: true,
                layout: layouts.navTop,
                tipo: 'portaria'
      },
      children: [
                {   path: '/create', //added / here
                    name: 'create',
                    component: PortariaCreate,
                    meta: {
                        auth: true,
                        layout: layouts.navTop
                    }
                }
            ],
        }
    ]
})

如果上述方法不起作用,请尝试更改 PortrariaCreate 的布局。如果这不起作用,直接把它作为到 Portaria 的兄弟路线,看看它在那里工作


推荐阅读