Vue路由的三种守卫

全局守卫：

需要用过路由对象router进行使用

前置守卫：

在路由发生跳转时最先触发的一定时全局的前置守卫，

后置守卫：

        在路由跳转进入后执行，执行时机在beforeEnter之后且在Vue的beforeCreate之前

独享守卫(比较少见)

与其他两种路由钩子不同的是它只有一个，而不是一对，需要在路由的routes数组的对应路由对象中进行配置，执行时机在全局前置守卫之后

组件内的路由守卫

从名字就可以得知它是存在组件当中的，需要在对应的组件中配置。
在进入组件时触发beforeRouteEnter(),执行时机在beforeEnter之后,afterEach之后

在组件路由地址添加了参数但没有跳转时会触发

beforeRouteUpdate()，同时在组件复用也会触发
在离开组件时触发beforeRouteLeave(),执行时机在离开组件时立即触发

注意：路由中有next的一定要执行next()才会跳转到页面，如果没有执行next()的话会导致页面无法跳转到相应页面，会出现白屏的情况

路由与Vue钩子顺序

路由发生跳转
beforeEach—>beforeEnter—>beforeRouteEnter—>afterEach—>beforeCreate—>created—>beforeMount—>mounted–vue的数据发生改变–>beforeUpdate—>Updated–离开当前组件–>beforeRouterLeave—>
跳转到第二个组件的顺序，注意，此时第一个组件的beforedestroy还没有销毁
beforeEach—>beforeEnter—>beforeRouteEnter—>afterEach—>beforeCreate—>created—>beforeMount—>第一个组件的beforeDestory—>第一个组件的destoryed—>mounted–vue的数据发生改变–>beforeUpdate—>Updated–离开当前组件–>beforeRouterLeave—>…

不足之处请多多指教