Vue路由守卫

路由守卫：个人理解就是当切换路由，页面路径改变的时候可以通过触发路由守卫的方法做一些逻辑处理，比如实现用户权限的判断或者是页面回显之类的业务。路由守卫分全局路由守卫（router.beforeEach,router.afterEach）和组件路由守卫(beforeRouteEnter,beforeRouteLeave)，还有路由独享守卫(beforeEnter)，下面简单介绍一下各个守卫起到的作用。

1，全局前置路由守卫:router.beforeEach((to,from,next)=>{})
全局前置路由守卫，顾名思义是在全局上配置的路由守卫，即对整个单页应用(spa)中的所有的路由都生效，此路由守卫执行时机实在进入每一个路由之前都会调用整个回调，该守卫钩子里有三个参数，to表示即将去的目标路由，form表示从哪个路由离开，next()是函数，表示允许通行，决定是否展示即将去的页面。
注:如果在回调函数中对路由的判断条件判断出错，就会导致死循环，因为守卫会一直执行，所以在使用全局前置守卫的时候一定要判断清楚可能会出现的路由跳转情况。

2，全局后置路由守卫:router.afterEach((to,from)=>{})
全局后置路由守卫，和前置路由守卫相比，相同点是都有to，from参数，不相同的点是，后置路由守卫的执行时机是在单个页面路由跳转之后调用回调函数，所以多用于路由跳转后的相应页面操作，并不像全局前置守卫那样会在回调中进行页面的重定向或跳转。

3，组件路由守卫
组件路由守卫分为到达这个组件时（beforeRouteEnter），离开这个组件时 (beforeRouteLeave)

1. beforeRouteEnter:(to,from,next)=>{}——到达

    to，from参数与上面使用方法一致。next回调函数略有不同。
   

2. beforeRouteLeave:(to,from,next)=>{}——离开

    点击其他组件时，判断是否确认离开。确认执行next()；取消执行next(false)，留在当前页面。