@fredwsw/frontend-rules 1.0.0

package/template/docs/uv-ui-docs/vtabs-cn.md

@@ -0,0 +1,190 @@
+---
+group: 导航
+category: Components
+title: Vtabs
+subtitle: 垂直选项卡
+description: 左侧分类选择、右侧内容展示，支持联动或非联动两种模式。
+cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*BD2JSKm8I-kAAAAAAAAAAAAADrJ8AQ/original
+coverDark: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*r29rQ51bNdwAAAAAAAAAAAAADrJ8AQ/original
+demo:
+  cols: 2
+---
+
+## 何时使用 {#when-to-use}
+
+垂直选项卡用于左侧分类、右侧内容的布局，左右自动联动，无需自行计算位置。
+
+- **联动模式**：右侧展示全部内容，滚动时左侧选项自动定位选中项
+- **非联动模式**：右侧仅在选中时展示对应内容
+
+开箱即用，简单配置即可。
+
+> 完整示例下载地址：[uv-ui 插件市场](https://ext.dcloud.net.cn/plugin?name=uv-ui)
+
+## 平台兼容性 {#platform}
+
+| App（vue） | App（nvue） | H5 | 小程序 | VUE2 | VUE3 |
+| --- | --- | --- | --- | --- | --- |
+| √ | √ | √ | √ | √ | √ |
+
+**组件名：** `uv-vtabs`、`uv-vtabs-item`
+
+## 代码演示 {#examples}
+
+### 联动模式 {#chain}
+
+设置 `chain=true` 开启联动：右侧展示全部内容，滚动时左侧自动定位。
+
+- 需配合 `uv-vtabs-item`，内容用 `v-for` 循环渲染
+- 有头部内容时需传 `hdHeight`，否则联动计算不准确；无头部时可不传（默认 0）
+
+```vue
+<template>
+  <view class="content">
+    <view style="height: 100rpx;background: #ecf5ff;color: #909193;display: flex;justify-content: center;text-align: center;">
+      <text style="font-size: 28rpx;">欢迎使用uv-vtabs，有头部内容必须传hdHeight参数</text>
+    </view>
+    <uv-vtabs
+      :chain="chain"
+      :list="list"
+      :height="height"
+      hdHeight="100rpx"
+      @change="change"
+    >
+      <!-- #ifdef VUE2 -->
+      <template v-for="(item,index) in list">
+        <uv-vtabs-item :index="index" :key="index">
+      <!-- #endif -->
+      <!-- #ifdef VUE3 -->
+      <template v-for="(item,index) in list" :key="index">
+        <uv-vtabs-item :index="index">
+      <!-- #endif -->
+          <view class="item" v-for="(item2,index2) in item.childrens" :key="index2">
+            <view class="item-title"><text class="text">{{ item2.name }}</text></view>
+            <view class="item-content"><text class="text">{{ item2.desc }}</text></view>
+          </view>
+          <view class="gap" v-if="index < list.length - 1">
+            <uv-gap bg-color="#f1f1f1" height="4"></uv-gap>
+          </view>
+        </uv-vtabs-item>
+      </template>
+      <uv-gap bg-color="#fff" height="600"></uv-gap>
+    </uv-vtabs>
+  </view>
+</template>
+<script>
+const getList = [
+  { name: 'uv-ui简介', childrens: [{ name: 'uv-ui简介', desc: '...' }] },
+  { name: 'uv-ui特点', childrens: [{ name: '全端兼容', desc: '...' }, { name: '集成工具', desc: '...' }] },
+  { name: '更新日志', badge: { show: true, value: 5 }, childrens: [{ name: '更新日志', desc: '...' }] },
+  { name: '设计规范', childrens: [{ name: '设计规范', desc: '...' }] },
+  { name: '交流反馈', childrens: [{ name: '交流反馈', desc: '...' }] }
+]
+export default {
+  data() {
+    return { list: [], chain: true }
+  },
+  computed: {
+    height() {
+      return uni.getSystemInfoSync().windowHeight - uni.upx2px(100)
+    }
+  },
+  onReady() {
+    setTimeout(() => { this.list = getList }, 500)
+  },
+  methods: {
+    change(index) { console.log('选项改变：', index) }
+  }
+}
+</script>
+<style scoped lang="scss">
+.item {
+  padding: 10rpx 20rpx;
+  &-title .text { font-weight: 700; font-size: 32rpx; color: #111; }
+  &-content .text { padding: 20rpx 0; line-height: 48rpx; font-size: 30rpx; color: #111; }
+}
+.gap { padding: 0 30rpx; }
+</style>
+```
+
+### 非联动模式 {#no-chain}
+
+设置 `chain=false` 关闭联动：右侧仅展示当前选中分类的内容，需手动根据 `value` 渲染数据。
+
+```vue
+<template>
+  <view class="content">
+    <uv-vtabs
+      :chain="chain"
+      :list="list"
+      :barItemBadgeStyle="{right:'20px',top:'12px'}"
+      @change="change"
+    >
+      <uv-vtabs-item>
+        <view class="item" v-for="(item2,index2) in list2" :key="index2">
+          <view class="item-title"><text class="text">{{ item2.name }}</text></view>
+          <view class="item-content"><text class="text">{{ item2.desc }}</text></view>
+        </view>
+      </uv-vtabs-item>
+    </uv-vtabs>
+  </view>
+</template>
+<script>
+const getList = [/* 同上 */]
+export default {
+  data() {
+    return { list: [], chain: false, value: 0 }
+  },
+  computed: {
+    list2() {
+      const _list = this.list[this.value]?.childrens
+      return _list ? _list : []
+    }
+  },
+  onReady() {
+    setTimeout(() => { this.list = getList }, 200)
+  },
+  methods: {
+    change(index) {
+      console.log('选项改变：', index)
+      this.value = index
+    }
+  }
+}
+</script>
+```
+
+## API {#api}
+
+### Vtabs Props {#props}
+
+| 参数 | 类型 | 默认值 | 说明 |
+| --- | --- | --- | --- |
+| list | Array | [] | 选项数组，元素如 `{ name: 'xx', badge?: {...}, childrens?: [...] }`，badge 参考 uv-badge |
+| keyName | String | name | 从 list 元素中读取的展示字段名 |
+| current | Number | 0 | 当前选中项索引 |
+| hdHeight | Number \| String | 0 | 头部高度，有头部时必传 (1.0.4) |
+| chain | Boolean | true | 是否联动，chain=true 时 VtabsItem 的 index 必传 |
+| height | Number \| String | 屏幕高度 | 整个列表高度 |
+| barWidth | Number \| String | 180rpx | 左侧区域宽度 |
+| barScrollable | Boolean | true | 左侧是否可滚动 |
+| barBgColor | String | $uv-bg-color | 左侧背景色 |
+| barStyle | Object | - | 左侧区域自定义样式 |
+| barItemStyle | Object | - | 左侧每项样式 |
+| barItemActiveStyle | Object | - | 左侧选中项样式 |
+| barItemActiveLineStyle | Object | - | 选中项竖线条样式，如 `{ background: '#2878FF' }` |
+| barItemBadgeStyle | Object | - | 徽标样式，用于调整位置 |
+| contentStyle | Object | - | 右侧区域样式 |
+
+### VtabsItem Props {#item-props}
+
+| 参数 | 类型 | 默认值 | 说明 |
+| --- | --- | --- | --- |
+| index | Number \| String | 0 | 内容区索引，chain=true 时必传 |
+
+### Vtabs Events {#events}
+
+| 事件名 | 说明 | 回调参数 |
+| --- | --- | --- |
+| @change | 选择改变时触发 | 选项索引 |
+| @scrolltolower | 内容滚动到底部触发 (1.0.4) | 选项索引 |

package/template/docs/uv-ui-docs/waterfall-cn.md

@@ -0,0 +1,276 @@
+---
+group: 布局
+category: Components
+title: Waterfall
+subtitle: 瀑布流
+description: 参差不齐的多栏布局，支持滚动加载，常用于商品展示等场景。
+cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*BD2JSKm8I-kAAAAAAAAAAAAADrJ8AQ/original
+coverDark: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*r29rQ51bNdwAAAAAAAAAAAAADrJ8AQ/original
+demo:
+  cols: 2
+---
+
+## 何时使用 {#when-to-use}
+
+瀑布流用于多栏参差不齐的布局，滚动到底部时可继续加载数据，常用于电商商品展示等。
+
+> 完整示例下载地址：[uv-ui 插件市场](https://ext.dcloud.net.cn/plugin?name=uv-ui)
+
+## 平台兼容性 {#platform}
+
+| App（vue） | App（nvue） | H5 | 小程序 | VUE2 | VUE3 |
+| --- | --- | --- | --- | --- | --- |
+| √ | √ | √ | √ | √ | √ |
+
+**组件名：** `uv-waterfall`
+
+## 注意事项 {#notice}
+
+- 集成了 uni-app 官方的 nvue 组件 [waterfall](https://uniapp.dcloud.net.cn/component/waterfall.html)，vue 与 nvue 用法不同，见下方示例
+- **APP-NVUE 中** 不能使用 uv-image 等组件，详见：[android 端 list 中为什么不能使用 uv-image 等组件](https://ask.dcloud.net.cn/article/1311)
+
+## 代码演示 {#examples}
+
+### 基本使用（vue） {#basic-vue}
+
+- `column-count`：列数，默认 2，范围 1–5
+- 列数为 2 需定义 `v-slot:list1`、`v-slot:list2`，列数为 3 则增加 `v-slot:list3`，以此类推
+- `@changeList` 必须处理：`e.name` 为 `list1` / `list2`，需手动 `this[e.name].push(e.value)`
+- 插槽内容需包一层 `view` 以磨平平台差异
+
+```vue
+<template>
+  <view class="waterfall">
+    <uv-waterfall
+      ref="waterfall"
+      v-model="list"
+      :add-time="10"
+      :left-gap="leftGap"
+      :right-gap="rightGap"
+      :column-gap="columnGap"
+      @changeList="changeList"
+    >
+      <template v-slot:list1>
+        <view>
+          <view v-for="(item, index) in list1" :key="item.id" class="waterfall-item">
+            <view class="waterfall-item__image" :style="[imageStyle(item)]">
+              <image :src="item.image" mode="widthFix" :style="{width:item.width+'px'}"></image>
+            </view>
+            <view class="waterfall-item__ft">...</view>
+          </view>
+        </view>
+      </template>
+      <template v-slot:list2>
+        <view>
+          <view v-for="(item, index) in list2" :key="item.id" class="waterfall-item">...</view>
+        </view>
+      </template>
+    </uv-waterfall>
+  </view>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      list: [],
+      list1: [],
+      list2: [],
+      leftGap: 10,
+      rightGap: 10,
+      columnGap: 10
+    }
+  },
+  computed: {
+    imageStyle(item) {
+      return item => {
+        const v = uni.upx2px(750) - this.leftGap - this.rightGap - this.columnGap
+        const w = v / 2
+        const rate = w / item.w
+        const h = rate * item.h
+        return { width: w + 'px', height: h + 'px' }
+      }
+    }
+  },
+  methods: {
+    changeList(e) {
+      this[e.name].push(e.value)
+    }
+  }
+}
+</script>
+```
+
+### 删除某项（vue） {#remove}
+
+使用 `this.$refs.waterfall.remove(id)` 删除，删除后需在 `@remove` 中从 list1/list2 里移除对应项。
+
+```vue
+<uv-waterfall ref="waterfall" @remove="remove">...</uv-waterfall>
+<script>
+export default {
+  methods: {
+    longHandle(item) {
+      uni.showModal({
+        title: '提示',
+        content: '确定删除？',
+        success: (res) => {
+          if (res.confirm) this.$refs.waterfall.remove(item.id)
+        }
+      })
+    },
+    remove(id) {
+      [this.list1, this.list2].forEach(arr => {
+        const idx = arr.findIndex(item => item.id == id)
+        if (idx > -1) arr.splice(idx, 1)
+      })
+    }
+  }
+}
+</script>
+```
+
+### 清空所有数据（vue） {#clear}
+
+使用 `this.$refs.waterfall.clear()`，会触发 `@clear`。下拉刷新、tab 切换等场景可先清空再赋新数据。
+
+```vue
+<uv-waterfall ref="waterfall" @clear="clear">...</uv-waterfall>
+<script>
+export default {
+  async onPullDownRefresh() {
+    this.list = []
+    this.$refs.waterfall.clear()
+    this.list1 = []
+    this.list2 = []
+    const { data } = await this.getData()
+    this.list = data
+    uni.stopPullDownRefresh()
+  },
+  methods: { clear() {} }
+}
+</script>
+```
+
+### 加载更多（vue） {#loadmore}
+
+触底时追加数据到 `list`，可配合 uv-load-more。
+
+```javascript
+async onReachBottom() {
+  if (this.loadStatus == 'loadmore') {
+    this.loadStatus = 'loading'
+    const { data } = await this.getData()
+    this.list.push.apply(this.list, data)
+    this.loadStatus = 'loadmore'
+  }
+}
+```
+
+### Tab 切换（vue） {#tab}
+
+tab 切换需先清空再赋新数据：
+
+```javascript
+async clickTab(e) {
+  this.list = []
+  this.$refs.waterfall.clear()
+  this.list1 = []
+  this.list2 = []
+  const { data } = await this.getData()
+  this.list = data
+}
+```
+
+### nvue 中使用 {#nvue}
+
+nvue 下直接使用 `cell` 渲染列表，无需插槽，数据绑在 `list` 上，使用 `@scrolltolower` 触底加载。**APP-NVUE 中不能用 uv-image**。
+
+```vue
+<template>
+  <uv-waterfall
+    column-count="2"
+    left-gap="10"
+    right-gap="10"
+    column-gap="8"
+    @scrolltolower="init"
+  >
+    <cell v-for="(item, index) in list" :key="item.id" class="waterfall-item-cell">
+      <view class="waterfall-item">
+        <view class="waterfall-item__image">
+          <image :src="item.image" mode="widthFix"></image>
+        </view>
+        <view class="waterfall-item__ft">
+          <view class="waterfall-item__ft__title"><text>{{ item.title }}</text></view>
+          <view class="waterfall-item__ft__desc"><text>{{ item.desc }}</text></view>
+        </view>
+      </view>
+    </cell>
+  </uv-waterfall>
+</template>
+<script>
+export default {
+  data() {
+    return { list: [] }
+  },
+  methods: {
+    async init() {
+      const { data } = await this.getData()
+      this.list.push.apply(this.list, data)
+    }
+  }
+}
+</script>
+```
+
+### 优化建议（vue） {#optimize}
+
+1. 可用 uv-image 替代 image，支持加载中、失败反馈
+2. `addTime` 越小体验越好，但两列高度差可能变大；可让后端返回宽高，前端提前算好每张图尺寸
+3. 页面跳走前清空，避免 `@changeList` 继续触发导致异常：
+
+```javascript
+onHide() {
+  this.$refs.waterfall.clear()
+}
+```
+
+## API {#api}
+
+### Waterfall Props {#props}
+
+| 参数 | 类型 | 默认值 | 说明 |
+| --- | --- | --- | --- |
+| v-model | Array | [] | 瀑布流数据（vue） |
+| idKey | String | id | 数据 id 字段，用于删除（vue） |
+| addTime | Number | 200 | 每次插入间隔 ms，影响两列高度（vue） |
+| columnCount | Number \| String | 2 | 列数，1–5 |
+| columnGap | Number \| String | 20 | 列间距 px |
+| leftGap | Number \| String | 0 | 左侧与列表间距 |
+| rightGap | Number \| String | 0 | 右侧与列表间距 |
+| showScrollbar | Boolean | false | 是否显示滚动条（nvue） |
+| columnWidth | Number \| String | auto | 列宽 px（nvue） |
+| width | Number \| String | 屏幕宽度 | 组件宽度（nvue） |
+| height | Number \| String | 屏幕高度 | 组件高度（nvue） |
+
+### Waterfall Methods {#methods}
+
+| 方法名 | 说明 | 适用 |
+| --- | --- | --- |
+| remove(id) | 根据 id 删除某条数据 | vue |
+| clear() | 清空所有数据 | vue |
+
+### Waterfall Events {#events}
+
+| 事件名 | 说明 | 回调参数 | 适用 |
+| --- | --- | --- | --- |
+| @changeList | 数据分配时触发，必须手动 push 到 list1/list2 | `{ name, value }`，如 `{ list1, {...} }` | vue |
+| @finish | 加载完成 | - | vue |
+| @clear | 清空时 | - | vue |
+| @remove | 删除某条时 | id | vue |
+| @scrolltolower | 滚动到底部 | - | nvue |
+
+### Waterfall Slots {#slots}
+
+| 插槽名 | 说明 |
+| --- | --- |
+| list1, list2, list3... | 对应列内容，列数 N 需定义 list1~listN（vue） |

package/template/rules/common.mdc

@@ -0,0 +1,90 @@
+---
+alwaysApply: true
+---
+# 回答规范
+
+- 回答的时候必须要说：“项目规范已了解”。然后再回答xxxx
+
+# 国际化规范
+- 国际化统一使用中文key，并且放在国际化json对象的最外层，使用const { t } = useI18n()
+- 简单的词，符号不参与国际化，采用拼接的方式，例如： `用户名称：`国际化出来应该是`${t('用户名称')}：`
+
+# eslint规范
+
+- eslint问题你都不需要修复。你只需要写代码。我的编辑器会自动修复。
+
+# 编码规范
+
+- 统一使用es6+语法，例如：禁止使用.then语法
+- 方法命名统一使用动名词组合，语义清晰，例如：`loadRoleList`、`handleSubmit`
+- 变量命名统一使用小驼峰，禁止中英文混合命名
+- 常量命名统一使用全大写+下划线，例如：`API_TIMEOUT`
+- 提倡提前 `return` 降低嵌套层级，非必要不超过3层嵌套
+
+# Vue开发规范
+
+- 新项目统一使用 Composition API + `<script setup>`
+- 单文件组件内容顺序统一为：`script` > `template` > `style`
+- 禁止在同一元素上同时使用 `v-for` 与 `v-if`
+- `v-for` 必须绑定稳定且唯一的 `key`，禁止使用不稳定 key
+
+# 页面与组件结构规范
+
+- 页面目录统一使用短横线命名（xxx-xxx）
+- 页面拆分出来的业务子组件，统一放在页面根目录下的 `components` 目录
+- 组件目录与组件名使用大驼峰，且至少两个单词
+
+# TypeScript规范
+
+- 接口命名统一使用 `I` 前缀，例如：`IUserInfo`
+- 所有跟请求相关的类型必须放到@types目录下
+
+# 组件开发规范
+
+- `defineProps` 中的每个字段需有业务注释
+- `props` 的字段应明确 `required` 或 `default`（二选一，语义清晰）
+- 严格遵循单向数据流：父传子用 `props`，子传父用 `emit`，禁止子组件直接修改父组件传入的 `props`
+- 使用 `v-model` 时需显式声明对应的 `props` 与 `update:*` 事件
+- 对于对象/数组类型 `props`，子组件禁止直接改引用内字段，应通过 `emit` 通知父组件更新
+
+# 路由规范
+
+- 路由跳转统一使用对象写法：`router.push({ path, query })`
+- 禁止手写 URL 字符串拼接 query 参数
+
+# CSS规范
+
+- 优先查看项目中是否存在unocss，如果存在则优先使用unocss的语法,并且精确到单位,例如 mt-12px（uniapp项目中，则为mt-24rpx）
+- 非必要情况下，尽量不使用行内样式
+
+
+# 设计规范
+
+- 任何项目的新页面设计，**默认优先使用浅色风格**。只有在你特别说明需要深色、或者页面为了对比/安全感等需求必须深色时，才采用深色主题。
+
+# 组件规范
+
+- 优先使用@/components中的组件，否则查看package.json，常见的有element-ui，element-plus，uv-ui
+- uv-ui组件使用方法参考rules: uv-ui-docs
+
+# 请求规范
+
+- 请求必须使用async await
+- 请求定义名称需使用`req${动名词组合}`，例如reqGetUserInfo，reqGetUserListPage
+- 请求入参不需要单独定义类型。返回结果需定义类型。如果不知道返回了什么类型，先定义类型文件，然后使用{[key: string]: any]}，并写上注释待补充
+
+# 错误处理规范
+
+- 对于已经由请求拦截器统一处理错误提示的接口，请勿在业务代码中再次对 `res.err !== 0` 分支调用 `showToast`，只需在 `res.err !== 0` 时直接 `return`
+- 只在 `res.err === 0` 时做成功提示和后续逻辑（如跳转、刷新），不要额外包一层无意义的 `try/catch` 和重复的错误提示文案
+- 仅在需要做特殊兜底或非标准错误处理（例如：本地计算抛错、非接口错误、需要上报埋点等）时再使用 `try/catch`，并在注释中说明原因
+
+
+# 安全规范
+
+- 禁止在任何用户可控内容渲染场景直接使用 `v-html`；确需渲染富文本时，必须先做白名单净化（如 `DOMPurify.sanitize`）
+- 生产环境必须关闭 sourceMap，禁止暴露 `.map` 文件
+- 禁止在前端硬编码任何云厂商长期密钥（如 OSS AccessKey）；统一使用后端下发的临时凭证（STS/RamRole）
+- 禁止使用高危动态执行 API：`eval`、`new Function`、`Function` 构造器、字符串形式 `setTimeout/setInterval`
+- 禁止通过 `innerHTML` 拼接脚本内容执行动态代码，优先 `textContent`/`createElement`
+

package/template/rules/uv-ui-docs.mdc

@@ -0,0 +1,111 @@
+---
+alwaysApply: false
+---
+
+# uv-ui - Vue / uni-app 组件库
+
+uv-ui 是一款适用于 Vue 和 uni-app 的跨端 UI 组件库，提供丰富的移动端与多端组件，帮助开发者快速构建高质量应用界面。组件文档在项目根目录中的docs/uv-ui-docs文件夹中。
+
+## Navigation
+
+- [uv-ui 官网](https://www.uvui.cn/)
+- [组件概览](docs/uv-ui-docs/components.md)
+
+## 最新组件
+
+- [Skeletons 骨架屏](docs/uv-ui-docs/skeletons.md)
+- [Calendars 新版日历](docs/uv-ui-docs/calendars.md)
+- [DropDown 下拉筛选](docs/uv-ui-docs/dropDown.md)
+- [Vtabs 垂直选项卡](docs/uv-ui-docs/vtabs.md)
+- [PickColor 颜色选择](docs/uv-ui-docs/pickColor.md)
+- [QRCode 二维码](docs/uv-ui-docs/qrcode.md)
+- [Waterfall 瀑布流](docs/uv-ui-docs/waterfall.md)
+
+## 基础组件
+
+- [Color 色彩](docs/uv-ui-docs/color.md)
+- [Layout 布局](docs/uv-ui-docs/layout.md)
+- [Icon 图标](docs/uv-ui-docs/icon.md)
+- [Button 按钮](docs/uv-ui-docs/button.md)
+- [Text 文本](docs/uv-ui-docs/text.md)
+- [Link 超链接](docs/uv-ui-docs/link.md)
+- [Image 图片](docs/uv-ui-docs/image.md)
+- [Transition 动画](docs/uv-ui-docs/transition.md)
+
+## 表单组件
+
+- [Form 表单](docs/uv-ui-docs/form.md)
+- [Input 输入框](docs/uv-ui-docs/input.md)
+- [Textarea 文本域](docs/uv-ui-docs/textarea.md)
+- [Checkbox 复选框](docs/uv-ui-docs/checkbox.md)
+- [Radio 单选框](docs/uv-ui-docs/radio.md)
+- [Switch 开关选择器](docs/uv-ui-docs/switch.md)
+- [Calendar 日历](docs/uv-ui-docs/calendar.md)
+- [Picker 选择器](docs/uv-ui-docs/picker.md)
+- [DatetimePicker 时间选择器](docs/uv-ui-docs/datetimePicker.md)
+- [Code 验证码倒计时](docs/uv-ui-docs/code.md)
+- [Keyboard 键盘](docs/uv-ui-docs/keyboard.md)
+- [Rate 评分](docs/uv-ui-docs/rate.md)
+- [Search 搜索](docs/uv-ui-docs/search.md)
+- [NumberBox 步进器](docs/uv-ui-docs/numberBox.md)
+- [Upload 上传](docs/uv-ui-docs/upload.md)
+- [Slider 滑动选择器](docs/uv-ui-docs/slider.md)
+
+## 数据组件
+
+- [List 列表](docs/uv-ui-docs/list.md)
+- [IndexList 索引列表](docs/uv-ui-docs/indexList.md)
+- [Tag 标签](docs/uv-ui-docs/tag.md)
+- [LineProgress 线形进度条](docs/uv-ui-docs/lineProgress.md)
+- [Badge 徽标数](docs/uv-ui-docs/badge.md)
+- [CountDown 倒计时](docs/uv-ui-docs/countDown.md)
+- [CountTo 数字滚动](docs/uv-ui-docs/countTo.md)
+- [Avatar 头像](docs/uv-ui-docs/avatar.md)
+- [Skeleton 骨架屏](docs/uv-ui-docs/skeleton.md)
+- [LoadingIcon 加载动画](docs/uv-ui-docs/loadingIcon.md)
+- [LoadingPage 加载页](docs/uv-ui-docs/loadingPage.md)
+- [LoadMore 加载更多](docs/uv-ui-docs/loadMore.md)
+- [Empty 内容为空](docs/uv-ui-docs/empty.md)
+
+## 反馈组件
+
+- [Tooltip 长按提示](docs/uv-ui-docs/tooltip.md)
+- [Alert 警告提示](docs/uv-ui-docs/alert.md)
+- [Toast 消息提示](docs/uv-ui-docs/toast.md)
+- [NoticeBar 滚动通知](docs/uv-ui-docs/noticeBar.md)
+- [Notify 消息提示](docs/uv-ui-docs/notify.md)
+- [NoNetwork 无网络提示](docs/uv-ui-docs/noNetwork.md)
+- [Popup 弹出层](docs/uv-ui-docs/popup.md)
+- [Modal 模态框](docs/uv-ui-docs/modal.md)
+
+## 布局组件
+
+- [Cell 单元格](docs/uv-ui-docs/cell.md)
+- [SwipeAction 滑动单元格](docs/uv-ui-docs/swipeAction.md)
+- [ScrollList 横向滚动列表](docs/uv-ui-docs/scrollList.md)
+- [Swiper 轮播图](docs/uv-ui-docs/swiper.md)
+- [Collapse 折叠面板](docs/uv-ui-docs/collapse.md)
+- [Grid 宫格布局](docs/uv-ui-docs/grid.md)
+- [Album 相册](docs/uv-ui-docs/album.md)
+
+## 导航组件
+
+- [Tabbar 底部导航栏](docs/uv-ui-docs/tabbar.md)
+- [BackTop 返回顶部](docs/uv-ui-docs/backTop.md)
+- [Navbar 自定义导航栏](docs/uv-ui-docs/navbar.md)
+- [ActionSheet 操作菜单](docs/uv-ui-docs/actionSheet.md)
+- [Tabs 标签选项卡](docs/uv-ui-docs/tabs.md)
+- [Steps 步骤条](docs/uv-ui-docs/steps.md)
+- [Subsection 分段器](docs/uv-ui-docs/subsection.md)
+- [Sticky 吸顶](docs/uv-ui-docs/sticky.md)
+
+## 其他组件
+
+- [Parse 富文本解析器](docs/uv-ui-docs/parse.md)
+- [Overlay 遮罩层](docs/uv-ui-docs/overlay.md)
+- [CodeInput 验证码输入](docs/uv-ui-docs/codeInput.md)
+- [ReadMore 展开阅读更多](docs/uv-ui-docs/readMore.md)
+- [Line 线条](docs/uv-ui-docs/line.md)
+- [Gap 间隔槽](docs/uv-ui-docs/gap.md)
+- [Divider 分割线](docs/uv-ui-docs/divider.md)
+- [More 其他小组件](docs/uv-ui-docs/more.md)