vue-router在兩個以上子路由的情況下，跳轉出錯

　　先說原因： 子路由的路徑如果是  :id  那么在添加相同級別的子路由就是沒用的；因為 :id  可以匹配使一個路由匹配多個不同的子路由；

 

　今天做畢設的時候，想在原本就有子路由的 根路徑上多加一個子路由，以實現 下方 tabbar 的點擊不改變；

  {
    path: '/home',
    name: 'home',
    component: Home,
    children: [
      {
        path: ':id',
        component: Disc
      },
      {
        path: 'search',
        component: Search
      }
    ]
  },

所以我直接將代碼加成了這樣，導致進入  /home/search 后立即返回了。

解決：

1. 將search改成跟/home同級別； 將search單獨寫成一個路由，那么tabbar就不方便一直在選中狀態了；

2.將 子路由 :id 前面加一個前綴；這樣需要改變相應的路由跳轉代碼；

  {
    path: '/home',
    name: 'home',
    component: Home,
    children: [
      {
        path: 'disc/:id', // 在router中就改變了這里
        component: Disc
      },
      {
        path: 'search',
        component: Search
      }
    ]
  },

 

 正常實現了！！