vue-router 判断是否登陆，未登录跳转登陆页面

最新推荐文章于 2023-07-16 18:28:49 发布

原创最新推荐文章于 2023-07-16 18:28:49 发布 · 2.2k 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了一种在移动应用中实现登录验证的方法。通过在main.js中使用Vue Router的beforeEach钩子，检查即将访问的页面是否需要认证。如果需要认证但用户尚未登录，则将用户重定向到登录页面。

移动app 只需验证首页是否登陆

meta: {
  title: 'index',
  requireAuth: true
}

main.js中

router.beforeEach((to, from, next) => {
  if (to.matched.some(m => m.meta.requireAuth)) {
    console.log(store.getters.token)
    // 对路由进行验证
    if (store.getters.token) { // 已经登陆
      next() // 正常跳转到你设置好的页面
    } else {
      // 未登录则跳转到登陆界面
      next({ path: '/login' })
    }
  } else {
    next()
  }
})