Vue Router 前置导航守卫：实现权限控制和防止无限重定向
// 前置导航守卫 router.beforeEach(async (to, from, next) => { const token = localStorage.getItem('token'); const rolesLocal = sessionStorage.getItem('roles'); const requiresAuth = to.meta.requiresAuth; const roles = to.meta.roles;
// 如果该路由有权限且未登录，则跳转登录页面
if (requiresAuth && !token && !roles) {
alert("请先登录！");
next("/login");
} else {
// 如果当前路由和目标路由相同，则不进行重定向
if (to.path === from.path) {
next();
} else {
if (rolesLocal === "admin") {
next("/home");
} else if (rolesLocal === "teacher") {
next("/teacherhome");
} else if (rolesLocal === "user") {
next("/userhome");
} else {
next();
}
}
}
})
原文地址: https://www.cveoy.top/t/topic/pRkA 著作权归作者所有。请勿转载和采集!