路由守卫实现基础校验功能

路由守卫实现基础校验功能

//每一次跳转前执行函数
//to,指的是你要跳转到的路径。form指的是你现在的路径。next是放行你跳转。
router.beforeEach((to,form,next) => {

  //拿到登录状态
  const isLogin = localStorage.isLogin;
  
  //如果已登录或去登录界面，放行
  if( isLogin || to.name === "Login"){
    next();
   }
   
   //否则强制跳转登陆界面
  else{
    next({ name: 'Login'})
    
  }
})

//精简
router.beforeEach((to,form,next) => {
  //拿到登录状态
  const { isLogin } = localStorage;
  (isLogin || to.name === "Login") ? next():next({ name: 'Login'});
 
})

 //只有访问页面之前才会执行这个函数，写在routes数组里，对应谁就写谁的PATH
    beforeEnter(to,from,next){
      const isLogin =localStorage.isLogin //拿到登录状态

      //假如已登录，自动跳转主页。不允许再次进入登录界面
      if(isLogin){
        next({ name: 'Home' })
      }else{
        next();
      }      
    }
    
    //精简
     beforeEnter(to,from,next){
      const { isLogin } =localStorage.isLogin //拿到登录状态
      isLogin ? next({name: 'Home'}) : next(); //判断逻辑
    }