uniapp+vue3+ts开发小程序或者app架构时候的UI框架选型

2024-06-05 小程序 0

使用vue3+ts+vite+uniapp开发小程序或者跨平台app的趋势越来越高，有一个顺手的UI的框架还是非常重要的，官方维护的 uni-ui，支持全端，而且有类型提示，目前已经内置到 GitHub - Sjj1024/uniapp-vue3: 使用uniapp和vue3 + ts + pinia + echarts + uview-plus开发的模板框架，为了防止自己建模板出错，集成了echart等所有的环境了，如果用户确实用不到里面的组件也可以删除，减少包体积。

经过搜寻了一番，目前参加对比的 UI 框架有：

1. uv-ui (uveiw 系) - https://www.uvui.cn/

2.uview-plus (uveiw 系) - 文档地址

3.Wot Design Uni (wot 系) - 文档地址

4.TuniaoUI （图鸟系） - 文档地址

还有 2 个 UI 框架也很优秀，但是只有部分组件开源免费，大半组件收费：

ThorUI 文档链接

FirstUI 文档链接

温馨提示：

收费没有对错，开源作者也要恰饭，需要有收入，光为爱发电可能半路夭折，或者质量很差。只要做得好，别人愿意买，提供优质的服务，也是极好的。

UI 框架对比

1. 开源热度

截止到 2024-05-18 发表文章时的数据:

UI 框架	uv-ui	uview-plus	wot	TuniaoUI
github stars	551	335	447	187
gitee stars	1.1K	154	80	-
github forks	28	91	69	20
gitee forks	71	5	13	-

其实到这里就一决高下了，github star 数： uv-ui > uview-plus > wot> TuniaoUI，其中 uv-ui 拔得头筹。

2. 多端支持情况

UI 框架	uv-ui	uview-plus	wot	TuniaoUI
h5	✅	✅	✅	✅
app(ios)	✅	✅	✅	✅
app(android)	✅	✅	✅	✅
微信小程序	✅	✅	✅	✅
支付宝小程序	✅	✅	✅	✅
QQ 小程序	✅	✅	❌	❌
百度小程序	✅	✅	❌	❌
头条小程序	✅	✅	❌	❌

3. 组件数量

UI 框架	uv-ui	uview-plus	wot	TuniaoUI
总数	67	67	62	55
基础组件	8	11	8	5
表单组件	16	17	20	14
数据组件	13	4	18	4
反馈组件	8	10	16	8
布局组件	7	9	-	8
导航组件	8	8	7	5
其他组件	7	8	-	5
内容组件	-	-	-	6