什么是导航守卫?
正如其名,vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。有多种机会植入路由导航过程中:全局的, 单个路由独享的, 或者组件级的。通俗来说就是钩子函数,在对应的路由行为时触发,部分钩子可以阻止 /改变此次路由行为,所以称之为守卫
都有哪些导航守卫(钩子函数)?
前置守卫:
1. 全局的前置守卫: beforeEach beforeResolve(同时在所有组件内守卫和异步路由组件被解析之后,解析守卫就被调用)
2. 路由独享的守卫: beforeEnter
3. 组件内的守卫: beforeRouterEnter、beforeRouterUpdate、beforeRouteLeave
后置守卫:
全局的后置守卫: afterEach
拓展一下~
1:导航守卫的执行顺序是怎么样的?
beforeRouteLeave < beforeEach < beforeRouteUpdate < beforeEnter < beforeRouteEnter < beforeResolve < afterEach
2:导航守卫中的next的用处?
next的作用,使导航守卫队列的继续向下迭代
3:为什么afterEach守卫没有next?
afterEach根本不在导航守卫队列内,没有迭代的next
4:beforeEach是否可以叠加?
beforeEach是可以叠加的,所有的全局前置守卫按顺序存放在beforeHooks的数组里面,
5:路由跳转经历了哪几部分?
路由跳转的核心方法是transitionTo,在跳转过程中经历了一次confirmTransition,
(beforeRouteLeave < beforeEach < beforeRouteUpdate < beforeEnter < 异步组件加载)这样顺序的queue为第一个,在第一个queue迭代完毕后,执行第二个(beforeRouteEnter < beforeResolve)这样顺序的queue,在执行完毕后,开始执行updateRoute,之后执行全局的afterEach守卫。最后完成路由的跳转。
网友评论