背景
逻辑是判断访问设备是PC还是移动设备,想如果是移动设备就屏蔽访问,PC则通行。
死循环
router.beforeEach((to, from, next) => {
if (!isMobile()){ // PC端访问
console.log("PC端访问")
if (to.path !== '/login' && to.path !== '/register' && !isLogin()) {
return next('/login')
}
next()
}
else {
console.log("移动设备")
next('/tip')
}
})
结果报错栈溢出:
RangeError: Maximum call stack size exceeded
原因
因为 next('/tip') 会在进入前 又要进入
beforeEach
中 ,这样就会一直循环下去,所以就是想如何跳出这个循环即可
修改
router.beforeEach((to, from, next) => {
if (!isMobile()){ // PC端访问
console.log("PC端访问")
if (to.path !== '/login' && to.path !== '/register' && !isLogin()) {
return next('/login')
}
next()
}
else {
console.log("移动设备")
if (to.path == '/tip'){ //关键所在:如果要跳转的路径是/tip才放行
next()
}
else {
next('/tip')
}
}
})
效果: