路由的定義，主要有以下幾步：

1. 如果是模組化機制，需要呼叫 Vue.use(VueRouter)

2. 定義路由元件，如：

   const Foo = {
      template: '<div>foo</div>'
   };

3. 定義路由（陣列）：

   const routes = [
      {
          path: '/foo',
          component: Foo
      }
   ];

4. 建立 router 例項

   const router = new VueRouter({
      routes
   });

5. 建立和掛載根例項

   const app = new Vue({
      routes
   }).mount('#app'
    
   );

巢狀路由主要是通過 children，它同樣是一個數組：

{
    path: '/user',
    component: User,
    children: [
        {
            path: 'file',
            component: File
        }
    ]
}

這時訪問，/user/file 會對映到 File 元件

動態路由的建立，主要是使用 path 屬性過程中，使用動態路徑引數，以冒號開頭，如：

{
    path: /user/:id
    component: User
}

這會是訪問 user 目錄下的所有檔案，如 /user/a 和 /user/b，都會對映到 User 元件

當匹配到 /user 下的任意路由時，引數值會被設定到 this.$route.params 下，所以通過這個屬性可以獲取到動態引數，如：

const User = {
    template: '<div>User {{ $route.params.id }}</div>'
}

這裡會根據訪問的路徑動態的呈現，如訪問 /user/aaa 會渲染：

<div>
    User aaa
</div>