Procházet zdrojové kódy

refactor(tabbar): 切换为原生tabbar并清理自定义tabbar相关代码

移除自定义tabbar的配置和代码,改为使用原生tabbar实现
清理未使用的http请求代码和TODO注释
更新相关配置文件和组件逻辑
feige996 před 8 měsíci
rodič
revize
477edaea1a
3 změnil soubory, kde provedl 7 přidání a 11 odebrání
  1. 1 1
      src/pages.json
  2. 2 2
      src/tabbar/config.ts
  3. 4 8
      src/tabbar/index.vue

+ 1 - 1
src/pages.json

@@ -15,7 +15,7 @@
     }
   },
   "tabBar": {
-    "custom": true,
+    "custom": false,
     "color": "#999999",
     "selectedColor": "#018d71",
     "backgroundColor": "#F8F8F8",

+ 2 - 2
src/tabbar/config.ts

@@ -20,7 +20,7 @@ export const TABBAR_MAP = {
 // 如果是使用 NO_TABBAR(0),nativeTabbarList 和 customTabbarList 都不生效(里面的配置不用管)
 // 如果是使用 NATIVE_TABBAR(1),只需要配置 nativeTabbarList,customTabbarList 不生效
 // 如果是使用 CUSTOM_TABBAR(2,3),只需要配置 customTabbarList,nativeTabbarList 不生效
-export const selectedTabbarStrategy = TABBAR_MAP.CUSTOM_TABBAR_WITH_CACHE
+export const selectedTabbarStrategy = TABBAR_MAP.NATIVE_TABBAR
 
 type NativeTabBarItem = TabBar['list'][0]
 // TODO: 2/3. 使用 NATIVE_TABBAR 时,更新下面的 tabbar 配置
@@ -48,7 +48,7 @@ interface CustomTabBarItem {
   badge?: number | 'dot' // badge 显示一个数字或 小红点(样式可以直接在 tabbar/index.vue 里面修改)
   isBulge?: boolean // 是否是中间的鼓包tabbarItem
 }
-// TODO: 2/3. 使用 CUSTOM_TABBAR(2,3) 时,更新下面的 tabbar 配置
+// TODO: 3/3. 使用 CUSTOM_TABBAR(2,3) 时,更新下面的 tabbar 配置
 export const customTabbarList: CustomTabBarItem[] = [
   {
     text: '首页',

+ 4 - 8
src/tabbar/index.vue

@@ -1,6 +1,5 @@
 <script setup lang="ts">
 // 'i-carbon-code',
-import { http } from '@/http/http'
 import { tabbarList as _tabbarList, customTabbarEnable, needHideNativeTabbar, tabbarCacheEnable } from './config'
 import { tabbarStore } from './store'
 
@@ -11,14 +10,11 @@ defineOptions({
 })
 // #endif
 
-// #region 接口获取tabbar demo
-http.get('/foo').then((res) => {
-  console.log('接口获取tabbar demo', res)
-})
-// #endregion
-
 // TODO 1/2: 中间的鼓包tabbarItem的开关
 const BULGE_ENABLE = false
+/**
+ * 中间的鼓包tabbarItem的点击事件
+ */
 function handleClickBulge() {
   uni.showToast({
     title: '点击了中间的鼓包tabbarItem',
@@ -94,7 +90,7 @@ function getImageByIndex(index: number, item: { iconActive?: string, icon: strin
           <view v-if="item.isBulge" class="relative">
             <!-- 中间一个鼓包tabbarItem的处理 -->
             <view class="bulge">
-              <!-- TODO 2/2: 通常是一个图片,或者icon,点击触发业务逻辑 -->
+              <!-- TODO 2/2: 中间鼓包tabbarItem配置:通常是一个图片,或者icon,点击触发业务逻辑 -->
               <!-- 常见的是:扫描按钮、发布按钮、更多按钮等 -->
               <image class="mt-6rpx h-200rpx w-200rpx" src="/static/tabbar/scan.png" />
             </view>