vue-router 是 vue 官方提供的路由管理器；使用 path-to-regexp 作为路径的匹配引擎，所以支持很多的高级的配置模式；

　　vue-router 的模式一共分为： hash、history、abstract 三种；

导航

　　vue-router 的导航分为两种模式：声明式导航和编程式导航；

　　声明式导航：通过 router-link 进行导航的路由方法；

　　编程式导航：通过 router.push 的方法进行导航的路由方法；

　　　　编程式导航的方式：

　　　　　　1)、router.push('user')；

　　　　　　2)、router.push({path: 'user/1234'})；

　　　　　　3)、router.push({name: 'user', patams: { userId: 1234 }})

　　　　　　4)、router.push({path: 'user/1234', query: {type: test}})

　　　　在编程式导航中，name 的方法一般只在动态路由中使用；动态路由即定义路由的时候，路径中使用了冒号（“：”）的路径，例如 {name: 'user'，path: ' user/:userId '}；使用了 name 属性之后就不能再使用 path 了；其实 name 方式是用到了 命名路由的方式；

命名路由

　　所谓的命名路由其实就是使用 name 属性在定义路由的时候给路由一个标记，再次使用的使用可以通过使用这个标记进行识别；

命名视图

　　有时候我们想对在同级进行展示多个路由组件，但是呢又想有的路右下边展示，有的路由下边不展示，这样用其他的方式去实现的话可能就会比较麻烦，而且可能还会要用到各种的判断，这时候我们就可以采用命名视图的方式就会简单方便一点了，也就是在 <router-vew /> 上添加 name 属性，这样就可以匹配我们在定义 components 下边的名字了，例如：

　　{path: 'user', components: { header: Header, container: User, footer: Footer}}

　　<router-view class=''header" />  <router-view class=''container" />  <router-view class="Footer" />

　　当我们匹配路由的时候，如果定义的 components  中存在 header 就会在 <router-view class=''header" /> 的位置展示 header 属性对应的组件；container 和 footer 同样的；