uView UI 是一個基于 uni-app 的高質量 UI 組件庫，提供豐富的跨平臺組件（支持 H5、小程序、App 等）。以下是其核心組件的分類大全及功能說明，結合最新版本（1.2.10）整理：

---

📦?一、基礎組件

1. 按鈕 (Button)

   • 支持主題色、鏤空、禁用等樣式，可設置?openType（如微信小程序授權）和回調事件。

2. 圖標 (Icon)

   • 內置多種圖標，支持自定義顏色、大小、背景色和漸變色。

3. 布局 (Layout)

   • 提供柵格系統（Row/Col），支持響應式布局。

4. 標簽 (Tag)

   • 可設置圓角、描邊、禁用狀態，支持前后插槽和漸變色背景。

---

📝?二、表單組件

1. 輸入框 (Input)

   • 支持清除圖標、格式校驗，修復了內容錯位問題。

2. 表單 (Form)

   • 集成校驗規則，支持動態添加/刪除表單項（需配合?data-cell?組件）。

3. 選擇器 (Picker)

   • 時間、日期、地區等多維數據選擇。

4. 驗證碼 (Sms-Code)

   • 短信驗證碼輸入組件，支持倒計時和重發功能。

---

📊?三、數據展示

1. 數據塊 (Data-Block)

   • 展示結構化數據，支持背景圖、邊框、懸停效果和最大寬度限制。

2. 列表 (List)

   • 瀑布流布局，支持分頁加載（需搭配?Load-More?組件）。

3. 表格 (Table)

   • 多列數據展示，支持排序和篩選（如?ua-table）。

4. 標簽頁 (Tabs)

   • 可滑動切換的內容容器，兼容自定義導航欄。

---

🧭?四、導航與布局

1. 導航欄 (Navbar)

   • 自定義導航欄，需配合狀態欄高度計算（statusBarHeight + navbarHeight）。

2. Dock 菜單 (ua-Dock)

   • 毛玻璃底部導航欄，支持圖標、徽章和滾動。

3. 狀態欄 (Status-Bar)

   • 動態適配不同設備狀態欄高度。

---

💬?五、反饋與交互

1. 頂部提示 (TopTips)

   • 頁面頂部滑出提示，支持成功/警告等主題，需在?onReady?生命周期調用。

2. 彈窗 (Popup)

   • 從屏幕邊緣彈出內容，支持自定義位置和動畫（1.2.9 版本優化）。

3. 操作菜單 (Action-Sheet)

   • 底部彈出選擇菜單，支持圖標和顏色定制。

4. 加載提示 (Load-More)

   • 分頁加載狀態提示（如“加載中”“無更多數據”）。

---

🎨?六、其他特色組件

1. 圖表 (Charts)

   • 集成?u-charts?庫，支持折線圖、餅圖等。

2. 時間軸 (Timeline)

   • 展示步驟或歷史記錄。

3. 富文本編輯器 (Rich-Text)

   • 內置編輯器，支持圖文混排。

4. 遮罩層 (Overlay)

   • 半透明遮罩，用于彈窗背景（1.2.9 新增）。

---

???安裝與配置建議

1. 依賴安裝

   npm install uview-ui
   # 必須安裝 SCSS 插件（HBuilderX 中搜索 "scss/sass 編譯"）。

2. 全局配置

   • main.js?引入：import uView from "uview-ui"; Vue.use(uView);

   • uni.scss?添加：@import 'uview-ui/theme.scss';

   • App.vue?首行引入：@import "uview-ui/index.scss";（需?lang="scss"）。

3. 按需使用

   • 配置?pages.json?的?easycom?規則，無需手動導入組件4：

     json

     "easycom": {"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
     }

---

💎?注意事項

• 自定義導航欄問題：使用?TopTips?時需傳入?navbar-height（狀態欄高度 + 導航欄高度）。

• 樣式覆蓋：修改組件樣式需用?::v-deep?并指定父類（兼容小程序）。

• 包體積優化：發行時自動剔除未使用組件，開發模式體積較大屬正常現象。

以上組件均支持?H5、小程序、App?等平臺，最新版本詳見?uView 更新日志。完整文檔可訪問?uView 官網