Vue 路由

vue官网中关于Vue路由的说明：https://router.vuejs.org/zh/

1. 路由
   【注意】项目初始化时不要集成vue-router

2. 安装
   npm install vue-router --save

3. 如果在一个模块化工程中使用路由，必须要通过Vue.use()明确安装路由功能：

main.js中

import VueRouter from 'vue-router'

Vue.use(VueRouter);

4. 创建路由
   main.js中

const router = new VueRouter({
  routes: [
    {
      path: "/hello",
      name: "HelloWorld",
      component: HelloWorld
    }
  ]
});

5. 给出路由显示的位置
   App.vue中在temple中添加：

<router-view></router-view>

6. 将路由对象注入vue实例中
   main.js中：router

new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>'
})

7. 路由跳转

<router-link tag="" to=""></router-link>
<router-view></router-view>

8. 动态路由（参数传递）
   /:id

9. 路由嵌套

10. 编程式导航

this.$router.push(路径、对象......);
this.$router.replace(路径、对象);
this.$router.go(n);