VUE的路由导航守卫以及VUE的路由模式

1. 什么是导航守卫

路由的导航守卫 又叫做路由的钩子函数 或者路由的生命周期函数 是在页面跳转的过程中到了某一个特定的时间节点会触发的钩子函数
共分为三种七个
① 全局守卫
beforeEach 路由进入之前（全局前置守卫）
beforeResolve 路由解析之前
afterEach  路由进入之后（全局后置守卫）

② 组件级守卫
beforeRouteEnter 路由进入之前
beforeRouteUpdate 路由更新之前
beforeRouteLeave 路由离开之前

③ 单个路由独享的守卫
beforeEnter 路由进入之前

注：这些导航守卫有三个参数 to from next

to 代表到哪儿去，from 代表从哪儿来 ，next 代表执行下一步

next 的参数除了括号里可以是空和路径之外，还可以是一个回调函数（回调函数就是一个被作为参数传递的函数）

2. 导航守卫的使用场景

在写代码的过程中我一般用导航守卫进行页面的鉴权处理，在用户登陆成功的时候，我们会把 token 和用户信息存到 vuex 或者本地存储中，代表了用户的登陆状态，在访问某个页面的时候判断是否存的有 token，就能正常访问这个页面，如果没有 token，那么就用 next 跳转到登陆页面

3. 导航守卫的执行顺序

beforeEach   全局前置守卫
beforeEnter   独享守卫
beforeRouteEnter   组件前置守卫
beforeResolve    全局解析守卫
afterEach    路由后置守卫

4. beforeEach 和 beforeResolve 的区别

这两个都是全局守卫 都是在路由跳转之前就会执行的守卫
beforeEach 比 beforeResolve 执行的时间要更早

5. vue路由的模式以及他的区别包括原理

vue 的路由模式⼀共有两种,分别是哈希和 history.。

他们的区别是 hash 模式不会包含在 http 请求当中，并且 hash 不会重新加载⻚⾯，⽽使⽤ history 模式的话，如果前端的 url 和后端发起请求的 url 不⼀致的话，会报 404 错误，所以使⽤ history 模块的话我们需要和后端进⾏配合.
history 的原理就是利⽤ html5 新增的两个特性⽅法，分别是 pushState 和 replaceState 来完成的。