写在前:当前环境,复制登录后的单页面链接分享他人,他人并没有登陆过,实现他人打开这个链接未登录的情况下,路由重定向登录页,以防数据等参数错误导致页面不能查看问题。
1.登陆页面,登陆成功后本地记录
sessionStorage.setItem('userId', resdata);
2.在main.js 中
router.beforeEach((to, from, next) => {
if (to.matched.some((auth) => auth.meta.requireAuth)) {
let userId= sessionStorage.getItem("userId");
if (userId) {
next();
} else {
next({
path: "/login"
});
}
} else {
next();
}
})
3.路由页面
const routes = [{
path: '/login',
component: Login,
name: 'login',
meta: {
title: "校园巡课"
}
}, /*登录页路由跳转*/
{
path: '/img',
component: Img,
name: 'img',
meta: {
title: "校园巡课",
requireAuth: true
}
}]