vue中带参路由如何加入白名单跳过登陆

在 Vue 中，我们可以通过路由守卫来实现白名单跳过登录的功能。具体步骤如下：

1. 在路由配置文件中设置需要进行登录验证的路由。

const router = new VueRouter({
  routes: [
    {
      path: '/',
      component: Home,
      meta: {
        requiresAuth: true // 需要验证登录
      }
    },
    {
      path: '/login',
      component: Login
    }
  ]
})

2. 在路由守卫中进行判断，如果当前路由需要验证登录并且用户未登录，则跳转到登录页面。

router.beforeEach((to, from, next) => {
  if (to.meta.requiresAuth && !isLogin()) {
    next('/login')
  } else {
    next()
  }
})

3. 在登录页面中添加跳过验证的逻辑，例如在登录成功后设置一个标志位。

// 在登录成功后设置标志位
localStorage.setItem('isLogin', true)

4. 在判断用户是否登录的函数中，添加对标志位的判断。

function isLogin() {
  return localStorage.getItem('isLogin') === 'true'
}

这样就可以实现带参路由的白名单跳过登录功能了。