使用vue-router beforeEach钩子遇到的一些小问题
2019-06-14 11:06
826 查看
一、从一个页面跳转到另一个页面时,如果用户未登录,需要跳转到登录页
此时全局路由拦截代码如下:
// 全局路由导航拦截 router.beforeEach((to, from, next) => { // ... let token = sessionStorage.getItem('userToken') // 获取用户登录token if (token === null || token === '') { // 如果token不存在或者为空 next({ path: '/login' }) // 则跳转到登录页 } })
当你点击路由进行跳转的时候,会发现报错了,如下图:
问题在于需要排除 此时地址 = 转向地址的情况,避免deep loop,解决方法如下:
// 全局路由导航拦截 router.beforeEach((to, from, next) => { // ... if (to.path === '/login') { // 如果是登录页面路径,就直接next() next() } else { // 其他页面路径 let token = sessionStorage.getItem('userToken') // 获取用户登录token if (token === null || token === '') { // 如果token不存在或者为空 next({ path: '/login' }) // 则跳转到登录页 } } })
相关文章推荐
- 记录使用 vue 遇到的一些问题
- 百度地图使用之-----vue项目中百度地图的应用以及遇到的一些问题
- vue router beforeEach 导航钩子(导航守卫)
- 使用vue-router与v-if实现tab切换遇到的问题及解决方法
- 在使用vue-router遇到的问题以及解决办法
- VueAwesomeSwiper在VUE中的使用以及遇到的一些问题
- maven使用中遇到的一些问题总结
- .net在使用Lucene中遇到的一些问题总结
- 我在Eclipse中使用Tomcat插件的遇到的一些问题
- 使用存储过程遇到的一些问题
- OSG中使用Tessellator遇到的一些问题
- Qt5中创建及使用自定义插件遇到的一些问题
- repo使用过程中遇到的一些问题及解决办法
- 使用desinger时遇到的一些问题的处理分享
- 关于IIS在使用中遇到的一些问题的总结
- Jedis使用中遇到的一些问题timeout no connection
- Sublime Text2 使用过程中遇到的一些问题
- 使用oracle遇到的一些问题
- Qt开发环境中使用报表控件FastReport遇到的一些问题(二)