原文地址：https://banggan.github.io/2019/01/03/Vue路由/
Vue Router是Vue.js的官方路由器。它與Vue.js核心深度整合，使用Vue.js構建單頁應用程式變得輕而易舉。

• 使用步驟
  1. 引入vue-router物件
  2. 安裝外掛：Vue.use(VueRouter)
  3. 建立一個路由物件 var router = new VueRouter（{routes：[]}）
  4. 配置路由物件 :routes:[{path:’/login/:name’,component:xx} ]
  5. 將配置好的路由物件關聯到事列中:router:router
  6. 指定路由改變區域性的位置:router-link ：to=‘’
• 查詢字串
  • 配置：to =“{name:‘detail’,query:{id:hero.id} }”
  • 規則：{name：‘detail’,path:’/detail’,component:Detail}
  • 獲取：this.$route.query.id
  • 生成：
• path方式
  • 配置：to =“{name:‘detail’,params:{id:hero.id} }”
  • 規則：{name：‘detail’,path:’/detail’/ :id}
  • 獲取：this.$route.params.id
  • 生成：
    path方式需要在路由規則中宣告位置
• vue-router中的物件
  • $route路由資訊物件，只讀物件
  • $router路由操作物件，只寫物件
• 巢狀路由
  單頁面應用開發多頁面的路由。多個元件按不同的錨點值填入不同的位置
  使用規則：
  1. router-view中包含router-view
  2. 路由規則中存在子路由
• 輔助知識點
• 路由meta元資料----meta對於路由規則是否需要驗證許可權的配置,路由物件中和name屬性同級 {meta：{isChecked：true}}
• 路由鉤子—許可權控制的函式執行時期
  • 每次路由匹配後，渲染元件到router-view之前
  • router.beforeEach(function(to,from,next){ }):next()直接放行，next(){}跳轉到相應的路由