vue-router安装和使用
vue-router可以在用脚手架建立项目时选择自动安装，如果没有，也可在项目建立后，按照如下方式安装：
1、IDE命令行终端：npm install vue-router --save
2、在工程中使用它（因为是一个插件，所以可以通过Vue.use()来安装路由功能）：
在src目录下建立route目录，里面创建index.js文件，配置路由相关内容：
1）导入路由对象，并且调用Vue.use(VueRouter)安装该插件
2）创建路由实例(与创建Vue实例相似)，并且传入路由映射配置
3）在Vue实例中挂载创建的路由实例
在index.js中的配置：
这里还有加入解决后期使用this.$router.push()方法多次执行造成的路由重叠问题：
/**
* 重写路由的push方法,解决再多次调用同一个push方法出现的问题
*/
const routerPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
return routerPush.call(this, location).catch(error=> error)
}在main.js中的配置：
路由的基本使用：
1、路由的默认路径：
设置默认进入的页面：比如打开网站就默认打开首页的内容
2、router-link的补充：
默认改标签被渲染成a标签，使用tag可以指定所渲染的标签
replace不会留下history记录，所以指定replace的情况下，后退键不能返回到上一个页面
当
我们也可以在router实例中设置改值：
3、路由代码跳转：
利用$router.push()方法可以实现路由的跳转，方法参数为所要跳转组件所对应的path
也可利用replace()方法，若使用该方法，效果和在
4、动态路由(一种基础的路由传参)：
在某些情况下，一个页面的path路径可能是不确定的，比如我们进入用户界面时，希望是如下路径：/user/uId，该路径除了前面的/user之外，后面还跟上了用户的ID；下面这种path和component之间的匹配关系，我们称之为动态路由(也是路由传递参数的一种方式)
传递：
接收：
5、路由的懒加载：
我们在项目中通常会定义很多组件，这些组件默认最后都被打包到一个js文件中，这样用户从服务器第一次请求时就可能需要花费一段时间，甚至用户电脑上还可能出现短暂空白。
为了避免这种情况，我们要使用路由的懒加载，这样最后用户的每个组件页面都会单独打包成一个js文件
使用（更改路由映射变得component的路径方式）：
嵌套路由：
嵌套路由是一个很常见的功能，比如在home页面中，我们希望通过/home/news和/home/message访问HomeNews组件和HomeMessage组件，这两个组件显然和Home组件不是同平级，是Home组件的子组件；一个路由映射一个组件，访问这两个路径也会分别渲染两个组件
实现嵌套路由的步骤：
1、创建对应的子组件，并在路由映射表中配置对应的子路由
2、在组件内部使用
路由参数传递：
传递参数主要有两种类型：params和query
params类型（动态路由）：
配置路由表path格式：/router/id
传递的方式：在path后面跟上对应的值
传递后形成的路径：/router/123
query类型：
配置路由表path格式：正常配置
传递的方式：使用对象
传递后形成的路径：/router?id=xx&name=xx
传递：
使用
使用路由代码跳转：
接收：
关于$router与$route：
$router代表router目录下index.js文件中的router实例，主要用于导航到不同的组件，使用其push()或replace()方法
$route代表当前处于活动状态的路由(路由映射表[]中)对象，从中可以获取name,path,query,params等
导航守卫：
全局导航守卫(在router实例所在index.js文件配置)：
这里用前置守卫+路由映射表相关设置实现标题的改变：
路由映射表中的映射信息加上meta选项：
路由独享的导航守卫(在路由映射表中配置)：
组件独享的导航守卫(在组件中定义)：
这里利用导航守卫beforeRouteLeave()+方法activated()+
首页中有新闻news和消息message，默认打开news，但点击消息后，点击关于，在返回后保持点开消息的状态
