next
介绍
- 但凡涉及到有参数的钩子,必须调用next()才能继续往下执行下一个钩子,否则路由跳转等会停止。
- 如果要中断当前的导航要调用next(false)。如果浏览器的 URL 改变了 (可能是用户手动或者浏览器后退按钮),那么 URL 地址会重置到from路由对应的地址。(主要用于登录验证不通过的处理)
- 当然next可以这样使用,
next('/')
或者next({ path: '/' })
跳转到一个不同的地址。意思是当前的导航被中断,然后进行一个新的导航。可传递的参数与router.push中选项一致。 - 在beforeRouteEnter钩子中
next((vm)=>{})
内接收的回调函数参数为当前组件的实例vm,这个回调函数在生命周期mounted之后调用,也就是,他是所有导航守卫和生命周期函数最后执行的那个钩子。
const router = new Router({
nroutes:[]
//beforEach全局前置守卫
//to目标路由对象
//from即将要离开的路由对象
//next它是最重要的一个参数,相当于佛珠的线,把一个一个珠子逐个串起来。
router.beforeEach((to, from, next) => {
try {
let uid = localStorage.getItem('uid');
if (uid) {
next('/manage/dhcpOption')
} else {
//没有登录,判断跳转地址是否为login,防止白屏
if (to.path === '/login') {
next();
} else {
next({
path: '/login'
} );
}
}
} catch (err) {
console.error(err);
}
})
export default router;
})