uniapp tabbar路由守卫

UniApp 的 TabBar 路由守卫是指在使用 TabBar 结构管理应用界面跳转时，对路由权限或者导航状态进行控制的一种机制。TabBar 是 UniApp 中一种常见的底部导航栏，用于组织和切换不同功能模块。

在 TabBar 中，你可以定义路由守卫来实现以下目的：
1. **权限控制**：检查用户是否有访问特定页面的权限，比如登录状态、角色权限等。
2. **导航逻辑**：根据用户的操作或状态决定跳转到哪个子页面，或者阻止某些跳转。
3. **状态管理**：在页面切换时保持某些数据的一致性，例如登录态管理、缓存清理等。

在 UniApp 中，路由守卫可以通过 Vue 的导航守卫（`beforeEach`、`beforeEnter` 等）来实现。在 TabBar 的配置中，可以为每个子路由设置对应的组件，然后在这些组件的父组件（通常是 TabBar 组件的所在页面）中设置导航守卫。

以下是实现 TabBar 路由守卫的基本步骤：
1. 定义路由：

const routes = [
  {
    path: '/tab1',
    component: Tab1,
    meta: { requiresAuth: true }, // 添加元信息标记是否需要权限
  },
  {
    path: '/tab2',
    component: Tab2,
  },
  // ...
];

2. 在父组件中设置守卫：

router.beforeEach((to, from, next) => {
  if (to.meta.requiresAuth && !store.state.isLoggedIn) { // 检查权限
    next({ path: '/login' }); // 如果无权限，重定向到登录页
  } else {
    next(); // 有权限或不需要权限，正常进入
  }
});