From 2293e635bfbb7aef6a19df6620c5519d4cd073d2 Mon Sep 17 00:00:00 2001 From: feige996 <1020102647@qq.com> Date: Sun, 17 Aug 2025 15:00:43 +0800 Subject: [PATCH] =?UTF-8?q?docs(tabbar):=20=E6=9B=B4=E6=96=B0tabbar?= =?UTF-8?q?=E7=9B=B8=E5=85=B3=E6=96=87=E6=A1=A3=E5=92=8C=E6=B3=A8=E9=87=8A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 更新README.md文件中的配置说明和文件说明,使其更清晰准确 在store.ts中添加注释说明文件用途 --- src/tabbar/README.md | 12 ++++++------ src/tabbar/store.ts | 1 + 2 files changed, 7 insertions(+), 6 deletions(-) diff --git a/src/tabbar/README.md b/src/tabbar/README.md index 15a9427..1f792fa 100644 --- a/src/tabbar/README.md +++ b/src/tabbar/README.md @@ -20,13 +20,13 @@ ## tabbar 配置说明 -- 如果使用的是原生tabbar, 则每个 `item` 需要配置 `path`、`text`、`iconPath`、`selectedIconPath` 等属性。 -- 如果使用的是自定义tabbar, 则每个 `item` 需要配置 `path`、`text`、`icon` 、`iconType` 等属性(如果是local还需要配置2种图片)。 +- 如果使用的是原生tabbar, 需要配置 `nativeTabbarList`,每个 `item` 需要配置 `path`、`text`、`iconPath`、`selectedIconPath` 等属性。 +- 如果使用的是自定义tabbar, 需要配置 `customTabbarList`,每个 `item` 需要配置 `path`、`text`、`icon` 、`iconType` 等属性(如果是 `image` 图片还需要配置2种图片)。 -## 接口拿到tabbar列表怎么处理? +## 文件说明 -首先,接口的配置需要跟原生tabbar的 `path` 对应上。 +`config.ts` 专门配置 `nativeTabbarList` 和 `customTabbarList` 的相关信息,请按照文件里面的注释配置相关项。 -然后,可以直接在 `index.vue` 文件请求接口拿到 `tabbarList`,然后赋值给 `tabbarList` 即可。 +`store.ts` 专门给 `自定义 tabbar` 提供状态管理,代码几乎不需要修改。 -最后,如果用的是 `unocss` 图标,还需要在 `uno.config.ts` 的 `safelist` 中添加图标名称。 \ No newline at end of file +`index.vue` 专门给 `自定义 tabbar` 提供渲染逻辑,代码可以稍微修改,以符合自己的需求。 diff --git a/src/tabbar/store.ts b/src/tabbar/store.ts index 6fce91e..897fb67 100644 --- a/src/tabbar/store.ts +++ b/src/tabbar/store.ts @@ -1,6 +1,7 @@ import { tabbarList } from './config' /** + * 自定义 tabbar 的状态管理,原生 tabbar 无需关注本文件 * tabbar 状态,增加 storageSync 保证刷新浏览器时在正确的 tabbar 页面 * 使用reactive简单状态,而不是 pinia 全局状态 */