react router @4 和 vue路由详解(八)vue路由守卫

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

完整版：https://www.cnblogs.com/yangyangxxb/p/10066650.html

13、vue路由守卫

a、beforeEach

全局守卫

(每个路由调用前都会触发，根据from和to来判断是哪个路由触发)

const router = new VueRouter({ ... })router.beforeEach((to, from, next) => {
// ...
})//每个守卫功能都有三个参数：
//to: Route：导航到的目标Route对象
//from: Route：当前路线被导航离开
//next: Function：必须调用此函数来解析钩子
// next()：继续前进到管道中的下一个钩子。如果没有留下挂钩，则确认导航。// next(false)：中止当前导航。如果浏览器URL已更改（由用户手动或通过后退按钮），则会将其重置为from路径的URL 。// next('/')或next({ path: '/' })：重定向到其他位置。当前导航将中止，并将启动一个新导航。你可以通过任何位置对象next，它允许您指定类似的选项replace: true，name: 'home'在使用任何选项router-link的to道具或router.push// next(error)：（2.4.0+）如果传递给的参数next是一个实例Error，导航将被中止，错误将传递给通过注册的回调router.onError()。`

举个