在路由配置里,使用路由的全局导航守卫来判断是否登录:

// 实例化对象
let router = new VueRouter({
  routes
})
// 注册导航守卫(回调函数)
router.beforeEach((to, from, next) => {
  if (to.path === '/login') {
    // 登录页 不需要判断
    next();
  } 
  //不是去登录页面
  else {
    // 不是去登录页面:判断登录 判断token是否存在即可
    let token = window.sessionStorage.getItem("token");
    if (token) {
      // 登录成功
      // 继续访问
      next();
    } else {
      // 不是去登录页面,也没有登录(判断是否有token)
      // 这里不是Vue实例 无法通过this访问 但是可以访问到Vue构造函数 可以通过原型访问
      Vue.prototype.$message.error('请先登录');
      // 打会登录页 可以使用next 进行路由跳转
      next('/login');
    }
  }
})
// 暴露出去
export default router;
Logo

前往低代码交流专区

更多推荐