vue路由守卫

在访问网站没有登录时进行某些操作时,常常会强制跳转到登录界面,这种操作可以通过vue的路由守卫来进行实现

1、什么是路由守卫

        路由守卫就是路由跳转过程中的一些钩子函数 ,在路由跳转的时候,做一些判断或其它的操作。 类似于组件生命周期钩子函数 

2、如何设置路由守卫

在vue项目的router文件夹中的index.js文件或router.js文件中

//实例化
const router = new VueRouter({
  routes
})

router.beforeEach((to,from,next)=>{
  //to 将要访问的路径
  //from 代表从那个路径跳转而来
  // next 是个函数,代表是否放行 next("./路径") 强制放行
  if(to.path == '/login') return next();
  //获取token值
  const gittoken = window.sessionStorage.getItem('token');
//判断token值是否存在,不存在则跳转到登录界面,如果存在则放行
  if(!gittoken) return next('/login');
  next(); 
});


//抛出
export default router
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值