菜狗刚学前端不久,记录一下。前面一直在想搞个拦截登录。结果偶然刷到帖子才发现是我想得太复杂了。直接使用sessionStorage或者localSession 要方便太多(token的性能更好,但是session更简单)。
开始👇
判断登录成功过后直接给它存进去
sessionStorage.setItem("Login", 'true'); //存session
在路由文件index里面
routes: [
{ path: '/main', name: 'main', component: main,
meta:{
// title:"首页",
requireAuth:true //为true时 需要判断路由
},
},
{path: '/login', name: 'login', component: login,
meta: {
//title:"登录",
requireAuth: false //bu需要加校检判断的路由
},},
{path: '/', name: 'tool', component:tool,
meta: {
requireAuth: false //不需要加校检判断的路由
},
},
.....
]
配置全局路由守卫
router.beforeEach((to, from, next) => {
if (to.meta.requireAuth) {
//判断该路由是否需要登录权限
//前面 meta:{ requireAuth:true },
if (sessionStorage.getItem('Login') === 'true' ) {
next(); //requireAuth 值为true时则可以跳转到其他页面
} else { //否则 未登录,跳转到登录页面
next('/login')
}
} else {
next()
}
})