一、巢狀路由（配置好父路由component後，在父路由下面新增children屬性來配置這個父路由的子路由）

需要注意的是：父元件中的<router-view></router-view>是子元件的佔位符是必不可少的

巢狀路由的現象：點選了路由跳轉之後父路由元件的內容一直呈現；子路由的內容進行切換，位址列的路徑也隨之改變。

// 巢狀路由
    {
      path: '/nest',
      component: () => import('@/nest/nest'),
      // 巢狀路由的關鍵字children，在父路由中新增children陣列 中新增子路徑
      children:[
        {
          // 要注意，以 / 開頭的巢狀路徑會被當作根路徑,這讓你充分的使用巢狀元件而無須設定巢狀的路徑。如果這裡的path的值為'/son1將無法渲染son1子元件'
          path: 'son1',
          component: () => import('@/nest/nest_son1')
        },
      ]
    }
 

上面子路由中加不加‘/’ 的區別：當去到son1的時候加 ‘/’會在位址列中顯示  #/son1;不加 ‘/’的時候回在位址列中顯示 #/nest/son1

注意：/xx就是根路徑

效果：

 若有不足請多多指教！希望給您帶來幫助!