1、全局的路由钩子函数
1.1、beforeEach(全局前置钩子),意思是在每次每一个路由改变的时候都要执行一遍
它有三个参数:
to: route:即将要进入的目标 路由对象
from:route:当前导航正要离开的路由
next:function:一定要调用该方法来resolve这个钩子。执行效果依赖next方法
应用场景:
1、进行一些页面跳转前的处理,例如跳转到的页面需要进行登录才可以访问时,就会做登录的跳转
2、进入页面登录判断、管理员权限判断、浏览器判断
1.2、afterEach(全局后置钩子)
beforeEach是在页面加载之前的,而afterEach是在页面加载之后的,所以这些钩子是不会接受next函数,也不会改变导航本身
2、单个路由内的钩子函数
2.1、beforeEnter
可以直接在路由配置上直接定义beforeEnter,这些守卫与全局前置守卫的方法参数是一样的
3、组件内的路由钩子函数
beforeRouteEnter、beforeRouteUpdate、beforeRouteLeave
应用场景
1、清除组件中的定时器
2、当页面有未关闭的窗口,或未保存的内容时,阻止页面跳转
3、保存相关内容到Vuex和Session中