2025年vue3 路由守卫(vue3路由守卫配置)

vue3 路由守卫(vue3路由守卫配置)一 路由全局前置守卫设置 permission ts 1 先判断是否有 token 没有 token 可以访问白名单页面 但未登录如果要去的不是白名单页面 让他到登录页面 然后再重定向到要去的页面 有 token 即登录成功 如果要去登录页 直接跳转 如果要去其他页面 2 要先判断是否有用户信息 有用户信息 如果没有从已有的所有路由中匹配到路由 有从上个路由过来的就直接跳到上个路由

大家好,我是讯享网,很高兴认识大家。



一、路由全局前置守卫设置。
permission.ts:

1、先判断是否有token。
没有token: 可以访问白名单页面;但未登录如果要去的不是白名单页面,让他到登录页面,然后再重定向到要去的页面。
有token(即登录成功):如果要去登录页,直接跳转;如果要去其他页面,

2、要先判断是否有用户信息—有用户信息:如果没有从已有的所有路由中匹配到路由,有从上个路由过来的就直接跳到上个路由,否则就跳到401;没有用户信息:先通过store获取用户信息,根据用户角色来获取并添加动态路由


讯享网

 

讯享网

二、根据用户角色来筛选获取并添加动态路由
store下的permission.ts:

讯享网

小讯
上一篇 2025-06-15 10:43
下一篇 2025-05-31 21:20

相关推荐

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容,请联系我们,一经查实,本站将立刻删除。
如需转载请保留出处:https://51itzy.com/kjqy/201832.html