uni_app中的选项卡

uni_app中的选项卡可以通过使用uni-app官方提供的组件 `uni-tab-bar` 来实现。该组件可以在底部或顶部显示多个选项卡，用户可以通过点击不同的选项卡来切换不同的页面。

使用 `uni-tab-bar` 组件可以通过以下步骤实现：

1. 在页面的 `template` 中添加 `uni-tab-bar` 组件，并设置 `tabList` 属性，指定选项卡的列表。

2. 在每个选项卡对应的页面中，添加 `tabBar` 属性，指定该页面对应的选项卡的索引值。

3. 在 `App.vue` 中设置 `tabBar` 属性，指定默认选中的选项卡的索引值，以及点击选项卡后的处理函数。

例如，以下示例代码实现了一个包含两个选项卡的底部选项卡菜单：

<template>
  <view>
    <view>
      <text>这是第{{activeIndex+1}}个页面</text>
    </view>
    <uni-tab-bar :tabList="tabList" @click="onTabBarClick" :active="activeIndex">
    </uni-tab-bar>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        activeIndex: 0,
        tabList: [
          {
            pagePath: "/pages/tab1/tab1",
            text: "选项卡1",
            iconPath: "/static/tab1.png",
            selectedIconPath: "/static/tab1_selected.png"
          },
          {
            pagePath: "/pages/tab2/tab2",
            text: "选项卡2",
            iconPath: "/static/tab2.png",
            selectedIconPath: "/static/tab2_selected.png"
          }
        ]
      };
    },
    methods: {
      onTabBarClick(e) {
        this.activeIndex = e.index;
      }
    }
  };
</script>

在每个选项卡对应的页面中，需要设置 `tabBar` 属性，例如：

<script>
  export default {
    tabBar: {
      index: 0
    }
  };
</script>

其中，`index` 表示该页面对应的选项卡的索引值。