vue路由

   安装
        cnpm i vue-router -S

    使用
        1： 在src/router.js文件，注册路由、创建路由实例并抛出
        2： 在入口文件main.js中引入路由实例并挂载
        3： 在App.js组件中，使用内置组件<router-view></router-view>容器来放置匹配成功的组件
        4： 使用<router-link></router-link>实现页面的跳转

    运用
        1）安装与配置：设计路径和组件匹配关系（一一对应关系）
        2）和路径url匹配成功的组件，放在哪里进行展示？（router-view容器）
        3）如何改变url？（router-link声明式路由，编程式路由）

    路由的基础知识
        1）命名视图：给router-view组件命名，只有名字匹配了组件才能显示在视图中。
        2）路由别名：给路由匹配关系取个小名，使用alias属性
        3）命名路由：给路由匹配关系取个名字，使用name属性。
        4）重定向：从一个路径自动跳转到另一个路径，使用redirect属性。
        5）两种路由模式：History模式 vs. Hash模式，前者部署至服务器会报404.
        6）编程式导航：this.$router.push() / replace()。
        7）通配符：在定义一一对应的路由匹配关系时，path中可以使用 * 来匹配任意字符。
        8）动态路由：`{path:'/detail/:id', component: Detail}`，在Detail组件中可以使用`this.$route.params.id`来接收参数。
        9）路由传参：`{path:'/detail/:id', component: Detail, props:true}`props选项来接收参数。
        10）嵌套路由：<router-view>组件可以进行多级嵌套，譬如`/find/good`这样的多级路由。
        11）路由懒加载：一种性能优化方案，让组件可以在路由匹配成功时按需加载。
        12）路由守卫：对路由匹配行为进行拦截，全局守卫使用`router.beforeEach()`，局部守卫使用`beforeRouteEnter()`，常常          用于实现登录权限拦截功能。
        13）watch侦听器，还可以监听 $route的变化。
   

配图：