1. 全局前置导航守卫
创建方式:调用router对象的beforeEach( )钩子函数,并传入一个有三个参数的回调
触发条件:跳转之前( 即路由值变化时 )执行
作用:路由切换之前进行登录拦截,一般用来防止未登录的用户强制访问主页
原理:当路由值变化时,全局前置守卫按照创建顺序自动调用(beforeEach( )钩子函数是同步的,但里面的回调是异步的)。守卫的解析执行是异步的,此时导航在所有守卫 resolve 完之前,一直处于 pedding状态(等待中)
参数1-- to: 即将要进入的目标,是一个路由信息对象(即 $route),所以“ to ”有path、name(映射关系的名字)、params、query、fullpath等路由对象的属性
参数2-- from: 当前导航正要离开的路由,也是一个路由对象,少用
参数3-- next: 函数,必须调用next( )函数来resolve这个beforeEach( )钩子函数。
next( )表示放行;
next(false)表示中断当前的导航;
next( 路径 或 含有path属性的对象),表示强制跳转到指定路径
2. 全局后置钩子
创建方式:调用router对象的afterEach( )钩子函数,并传入一个有2个参数的回调(参数可)
触发条件:跳转之后执行
作用:路由切换之后,做一些事情,例如关闭登录时显示的进度条
特点:这个钩子函数不能传入next()函数,也不能改变路由
3. 全局解析守卫
调用beforeResolve ( )钩子函数创建,用法与全局前置导航守卫几乎一样,区别是两者的被调用的条件不同 全局解析守卫被调用的条件:
-
跳转之前
-
在所有组件内,守卫和异步路由组件被解析之后
4. 路由独享的守卫
在配置路由规则数组时,使用beforeEnter( )直接定义该路由独享的守卫,它的参数与全局前置导航守卫相同
5. 组件内的守卫
在路由组件内直接定义这三个路由导航守卫
beforeRouteEnter
beforeRouteUpdate
beforeRouteLeave