vue中导航守卫[xiang]

• 什么是导航守卫

	用于在路由跳转前做一些验证，比如做登录身份验证

• 导航守卫的分类
  • 全局的, 单个路由独享的, 或者组件级的。

• 全局守卫包含：router.beforeEach()，router.beforeResolve() ，router.afterEach()、
• 路由独享beforeEnter()
• 组件内的守卫beforeRouteEnter、beforeRouteUpdate (2.2 新增)、beforeRouteLeave

to :即将要进入的目标  、 路由对象
from：当前导航要离开的路由
next：允许跳转到目标页面、，如果不写next()或者next(false)，页面路由不会跳转，也就是页面被阻止在当前页面了

• 全局守卫
  
• 路由独享守卫

const router = new VueRouter({
	routes:[{
		path:'/foo',
		component:Foo,
		beforeEnter:(to,from,next) =>{
				//写逻辑
		}
	}]
})

• 组件内守卫
  

• 导航守卫的执行顺序是怎么样的？

beforeRouteLeave < beforeEach < beforeRouteUpdate < beforeEnter < beforeRouteEnter < beforeResolve < afterEach

• 导航守卫中的next的用处？

next的作用，使导航守卫队列的继续向下迭代

• 为什么afterEach守卫没有next？

afterEach根本不在导航守卫队列内，没有迭代的next

• beforeEach是否可以叠加？

beforeEach是可以叠加的，所有的全局前置守卫按顺序存放在beforeHooks的数组里面，

• 路由跳转经历了哪几部分？

路由跳转的核心方法是transitionTo，在跳转过程中经历了一次confirmTransition，

• 导航解析流程

	1、导航被处罚。
	2、在失活的组件里调用离开守卫
	3、调用全局的beforeEach守卫
	4、在重用的组件里调用beforeRouteEnter守卫
	5、在路由配置里调用beforeEach
	6、解析异步路由组件
	7、在被激活的组件里diaoyongbeforeRouteEnter
	8、调用全局的beforeResolve守卫
	9、导航被确认
	10、调用全局的afterEach钩子。
	11、触发DOM更新。
	12 用创建好的实例调用beforeRouteEnter守卫中传给next（）回调函数