Vue路由守卫

路由守卫作用:和java拦截器相识,不能直接输入地址就能访问

1.跳转页面的时候 在window上加一个值(我写的token)

如图:


window.sessionStorage.setItem("值","里面的value");

vm.$router.push('/home') 为跳转地址

2.路由设置在一起了需要分开

如果路由设置在一起了需要分开


直接绑定发送出去需要分开


分开后,直接给router挂载

3.挂载路由守卫 

//挂载路由守卫

router.beforeEach((to,from,next)=>{

  //to表示要访问的地址

  //from代表从哪个路径跳转过来

  //next是一个函数 代表放行  1.next()  2.next('/login')强制跳转

  if(to.path==='/login') return next() //如果是login直接放行 不是就判断

  //获取token

  const tokenStr=window.sessionStorage.getItem('token') 

  if(!tokenStr) return next('/login') //判断是否有token 没有就强制跳转

  next() //有就放行

})

挂载的
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容