vue 设置路由导航守卫 控制路由跳转

     在实际项目中,通常有这样的需求,在用户没有登录的时候通常时不允许访问除了登录页面之外的页面,这个时候就需要使用路由导航守卫来控制跳转了,通常设置如下

在router文件夹下的index.js中添加如下代码

//为路由对象,添加beforEach导航守卫
router.beforEach ((to,from,next)=>{
    //to 将要访问的路径
    // from 代表从哪个路径跳转而来
    //next 表示放行函数 
    // next() 直接放行  next('/xxx') 强制跳转
    
    if(to.path === '/login') return next();
    const token = window.sessionStorage.getItem('token)
    if(!token) return next('/login')
    next()
})

 

  • 4
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值