3.4.2 嵌套路由
你可以通过 vue-router 的子路由创建 Nuxt.js 应用的嵌套路由。 创建内嵌子路由,你需要添加一个 Vue 文件,同时添加一个与该文件同名的目录用来存放子视图组件。
别忘了在父级 Vue 文件内增加 用于显示子视图内容。
假设文件结构如:


[mw_shl_code=applescript,true]pages/
‐‐| user/
‐‐‐‐‐| _id.vue 
‐‐‐‐‐| index.vue
‐‐| user.vue[/mw_shl_code]
Nuxt.js 自动生成的路由配置如下:

[mw_shl_code=applescript,true]router: { 
  routes: [  
   {     
  path: '/user',    
   component: 'pages/user.vue',   
    children: [      
   {      
     path: '',     
      component: 'pages/user/index.vue',    
       name: 'user'     
    },      
   {      
     path: ':id',      
     component: 'pages/user/_id.vue',    
       name: 'user‐id'   
      }      
]  
   }   ] }[/mw_shl_code]
将user.vue文件创建到与user目录的父目录下,即和user目录保持平级。

[mw_shl_code=applescript,true]   [/mw_shl_code]
_id.vue页面实现了向页面传入id参数,页面内容如下:

[mw_shl_code=applescript,true]  [/mw_shl_code]