如何在UniApp中不为每个一级页面都单独添加组件来实现全局定制的底部TabBar功能？

在 UniApp 中，如果你想要创建一个全局的定制底部 TabBar 而不是为每个一级页面分别添加，你可以通过以下步骤来实现：

1. **创建自定义组件**: 首先，创建一个名为 `CustomTabBar.vue` 的组件，它将包含所有共享的 tabBar 组件，如导航栏按钮、标签页等。

<template>
  <uni-tabbar :position="position" :custom-item="customItems">
    <!-- 全局的 tab 标签和图标 -->
    <tab-item v-for="(item, index) in items" :key="index" :title="item.title" :icon="item.icon" :selected="{{ item.selected }}"></tab-item>
  </uni-tabbar>
</template>

<script>
export default {
  data() {
    return {
      position: 'bottom', // 底部展示，默认值
      items: [
        { title: '首页', icon: 'home', selected: true },
        { title: '发现', icon: 'search' },
        { title: '我的', icon: 'person' }
        // ... 添加其他需要的标签项
      ],
      customItems: [] // 如果有自定义按钮，可以在这里定义
    };
  },
};
</script>

2. **注册组件**: 然后，在项目入口文件或 App.vue 中，你需要注册这个全局组件以便在整个应用中都可以使用。

// 在 App.vue 或 main.js 中注册 CustomTabBar 组件
import CustomTabBar from '@/components/CustomTabBar.vue';

Vue.component('custom-tab-bar', CustomTabBar);

3. **使用自定义组件**: 在需要的地方，比如布局或者公共组件中引入并嵌套这个 `CustomTabBar` 组件，这样就实现了全局的定制底部 TabBar。

<template>
  <view>
    <custom-tab-bar />
    <!-- 这里放置你的页面内容 -->
  </view>
</template>