vue3 js 公共路由隐藏

在Vue 3中，可以使用路由守卫来隐藏公共路由。路由守卫是Vue Router提供的一种机制，用于在路由切换时执行一些操作。具体步骤如下：

1. 在Vue Router中定义公共路由和需要隐藏的路由。
2. 使用全局前置守卫beforeEach()，在路由切换前进行判断。
3. 判断当前路由是否为需要隐藏的路由，如果是，则判断用户是否已登录，如果未登录，则跳转到登录页；如果已登录，则放行。
4. 如果当前路由不是需要隐藏的路由，则直接放行。

以下是示例代码：

// 在Vue Router中定义公共路由和需要隐藏的路由
const router = new VueRouter({
  routes: [
    { path: '/', component: Home },
    { path: '/login', component: Login },
    { path: '/dashboard', component: Dashboard, meta: { requiresAuth: true } }
  ]
})

// 使用全局前置守卫beforeEach()，在路由切换前进行判断
router.beforeEach((to, from, next) => {
  // 判断当前路由是否为需要隐藏的路由
  if (to.matched.some(record => record.meta.requiresAuth)) {
    // 判断用户是否已登录
    if (!isLoggedIn()) {
      // 如果未登录，则跳转到登录页
      next('/login')
    } else {
      // 如果已登录，则放行
      next()
    }
  } else {
    // 如果当前路由不是需要隐藏的路由，则直接放行
    next()
  }
})

// isLoggedIn()函数用于判断用户是否已登录，可以根据实际情况自行实现
function isLoggedIn() {
  // 判断用户是否已经登录
}