docs: 重构文档，将详细指南从README中移出

docs/custom-tab-bar.md

@@ -0,0 +1,87 @@
+# 自定义 TabBar
+
+基于 TDesign 组件的自定义 TabBar 实现，位于 `miniprogram/custom-tab-bar/` 目录。
+
+## 主要特性
+
+- 基于 TDesign 的 `t-tab-bar` 和 `t-tab-bar-item` 组件，样式统一美观
+- 自动状态同步，根据当前页面路由自动更新激活状态
+- 支持页面切换，点击 TabBar 项自动跳转到对应页面
+- 完整的 TypeScript 类型支持
+- 易于扩展和自定义
+
+## 配置说明
+
+### 1. 在 `app.json` 中启用自定义 TabBar
+
+```json
+{
+  "tabBar": {
+    "custom": true, // 配置为 true 开启自定义 tabbar
+    "color": "#000000",
+    "selectedColor": "#000000",
+    "backgroundColor": "#000000",
+    "list": [
+      {
+        "pagePath": "pages/one/index",
+        "text": "页面一"
+      },
+      {
+        "pagePath": "pages/two/index",
+        "text": "页面二"
+      },
+      {
+        "pagePath": "pages/three/index",
+        "text": "页面三"
+      },
+      {
+        "pagePath": "pages/four/index",
+        "text": "页面四"
+      }
+    ]
+  }
+}
+```
+
+### 2. TabBar 组件配置
+
+在 `miniprogram/custom-tab-bar/index.ts` 中配置 TabBar 项：
+
+```typescript
+data: {
+  value: 'label_1',
+  list: [
+    { value: 'label_1', label: '首页', icon: 'home', pagePath: '/pages/one/index' },
+    { value: 'label_2', label: '应用', icon: 'app', pagePath: '/pages/two/index' },
+    { value: 'label_3', label: '聊天', icon: 'chat', pagePath: '/pages/three/index' },
+    { value: 'label_4', label: '我的', icon: 'user', pagePath: '/pages/four/index' },
+  ],
+}
+```
+
+## 在 TabBar 页面中使用
+
+每个 TabBar 页面需要在 `onShow` 生命周期中调用 `init()` 方法来同步 TabBar 状态：
+
+```typescript
+Page({
+  onShow() {
+    // 同步 TabBar 激活状态
+    this.getTabBar().init()
+  },
+})
+```
+
+## 自定义 TabBar 项
+
+如需添加或修改 TabBar 项，请按以下步骤操作：
+
+1. 在 `miniprogram/custom-tab-bar/index.ts` 的 `data.list` 数组中添加或修改配置项
+2. 在 `miniprogram/app.json` 的 `tabBar.list` 数组中同步更新配置
+3. 确保对应的页面已创建并在 `app.json` 的 `pages` 数组中注册
+
+## 注意事项
+
+- TabBar 页面必须在 `onShow` 中调用 `this.getTabBar().init()`，否则可能出现状态不同步
+- `app.json` 的 `tabBar.list` 和 `custom-tab-bar/index.ts` 的 `data.list` 配置需保持一致（页面路径和顺序）
+- 支持的 TDesign 内置图标：`home`、`app`、`chat`、`user`、`setting` 等，更多参考 [TDesign 图标文档](https://tdesign.tencent.com/miniprogram/components/tab-bar)