简介
前端路由：
单页面应用程序员来说，主要通过URl中的hash（#/xxx）来实现不同页面之间的切换。同时，hash有一个特点：http请求中不会包含hash。相关内容；所以，单页面程序中的页面跳转主要用hash实现。
后端路由：对于普通的网站，所有超链接都是URL地址，所有的URL地址都对应服务器上对应的资源。
在单页面应用程序中，这种通过hash改变来切换页面的方式，称作前端路由（区别于后端路由）
路由的基本使用
1.引入路由模块
<script src="./lib/vue-router-3.0.1.js"></script>
2.创建路由对象
一个路径对应一个组件规则 ：
var router = new VueRouter({
// routes: 配置路径和对应组件
routes: [
{
// 需要配置的路径：
path: '/',
//配置路由单个组件
component: loginCmp },
{
})
一个路径对应多个组件规则 ：
var router = new VueRouter({
// routes: 配置路径和对应组件
routes: [
{
// 需要配置的路径：
path: '/',
// 配置路由 children ，配置 子路由（在父节点中配置 router-view 标签进行展示）
children: [
{ path: 'login', component: login },
// 子路由不要加'/'，否则永远都是以根路径开始
{ path: '/register', component: register }
]
{
})
路径重定向：
var router = new VueRouter({
// routes: 配置路径和对应组件
routes: [
{ path: '/', redirect: '/login' },
linkActiveClass: 'myactive'
})
选中标签类名可以用 linkActiveClass 来修改。默认为 .router-link-active
var router = new VueRouter({
routes: [
{ path: '/login', component: loginCmp },
linkActiveClass: 'myactive'
})
3.引用
使用 router-view 来在页面中展示 , 可以利用name来指定 components 内组件名字
<router-view name="default"></router-view>
在页面中用 router-link 或者 a 标签来定义跳转按钮
<router-link to="/register">注册1</router-link>
<a href="#/register">注册</a>
4传参
可以直接在路由配置里面配 占位符加名称，进行传参
可以用组件内$route.params.来读取对于值
{ path: '/login/:id/:name', component: login },
//!!!!可以用组件内$route.params.来读取对于值
console.log(this.$route.params.id);
更多内容可以参考api https://router.vuejs.org/zh/
