路由器鏈路不調用嵌套路線

我有一個路由器路由器鏈路不調用嵌套路線

routes: [ 
    { 
    path: '/', 
    name: 'home', 
    meta : { 
     label : 'Home' 
    }, 
    component: Home 
    }, 
    { 
    path: '/usuarios', 
    name: 'usuarios', 
    meta : { 
     label : 'Usuarios' 
    }, 
    component: Users, 
    children : [ 
     { 
     path: '/listar', 
     meta : { 
      label : 'Listar' 
     }, 
     name  : 'listUser', 
     component: Wrapper, 
     }, 
     { 
     path: '/cadastrar', 
     meta : { 
      label : 'Cadastrar !' 
     }, 
     name  : 'userCreate', 
     component: UserCreate 
     }, 
    ], 

    }, 

]

路由器查看和我有一個模板，我的導航欄

<div class="main"> 

    <ul class="menu-list"> 
    <li v-for="item in menus" v-on:click="toggleActive(item)"> 
     <router-link class="font-gray" :to="item.path" :exact="true">{{item.meta.label}}</router-link> 
     <ul class="menu-list" v-if="item.children && item.isActive"> 
     <li v-for="child in item.children"> 
      <router-link class="font-gray" :to="{path : item.path+child.path}" :exact="true" :append="true" >{{child.meta.label}}</router-link> 
     </li> 
     </ul> 
    </li> 
    </ul> 
</div>

渲染該路由器當我點擊第一個路由器 - 鏈接，視圖在路由器視圖中不會出現問題。但是，當我點擊兒童的路由器鏈接，它不起作用，

任何人有任何想法爲什麼？

來源

2017-05-23 Victor Oliveira

是不是因爲你正在使用'append'？你是什麼意思「它不工作」？ – thanksd

對不起，我只是用這個附錄做了一些測試。有或沒有它，它仍然無法正常工作。我的意思是它不會渲染標籤上的組件 –

您點擊鏈接並沒有任何反應？控制檯沒有錯誤？ – thanksd

此問題正在發生，因爲您已將前導斜槓/預置爲嵌套路徑的路徑。

從documentation on nested routes：

注意，嵌套在該開始/將作爲根路徑進行處理的路徑。這使您可以利用組件嵌套而不必使用嵌套的URL。

這意味着，即使你的"listar"路線是你"usuarios"路線的孩子，路徑/listar，不/usuarios/listar。

您應該刪除前從嵌套的路線路徑斜槓，然後指定模板的路徑，像這樣：

:to="{ path : item.path + '/' + child.path }"

來源

2017-05-23 15:33:13 thanksd

我刪除了正斜槓，只讓「listar」仍然不起作用。但是現在路由器視圖仍然可以在vue開發工具上看到 –

我終於想通了。

如果你有孩子，父親組件應該有一個<router-view>以及

在這裏找到了答案：Vue router2 not catching deep nested routes

謝謝大家的努力幫助

來源

2017-05-23 18:21:34

路由器鏈路不調用嵌套路線

回答

相關問題