如何从Vant Weapp、MinUI、iView Weapp、Wux Weapp、ColorUI共5个小程序组件库选型？

发展到今天，手机端组件库其实已经大同小异，熟练的程序员甚至都能背过80%的组件名称，比如toast、cell、checkbox……，来来回回就是这么些，那么，面对市面上最火的5个小程序组件库，我们该如何选择？

其实，并没有最好的那一个组件库，只是看你的需求。

以下数据统计于2019.3.20。

Vant Weapp

star：8578

github：https://github.com/youzan/vant-weapp

官网：https://youzan.github.io/vant-weapp

开发者：有赞

目前最后更新时间：2天前

印象：

组件数量很“中庸”，不多也不少，常见的组件类型一个不少，但是“有点独特想法”的组件几乎没有。

视觉上说比较无特色，画面比较粗糙，比如开关单元格，按钮上不能自定义文字（比如 开启/关闭，开/关 这种文字），而其他几个组件都可以显示文字。

iView Weapp

star：3931

github：https://github.com/TalkingData/iview-weapp

官网：https://weapp.iviewui.com/

开发者：移动互联网大数据平台（TalkingData）

目前最后更新时间：2个月前

印象：

组件数量跟Vant相当，但是没有任何选择器，比如没有时间选择器，也没有树形选择器等等。

比较特色的是“抽屉”，也就是从屏幕某侧伸出来一个浮层，可以作为菜单使用。

MinUI

star：3053

github：https://github.com/meili/minui

官网：https://meili.github.io/min/docs/minui/

开发者：美丽说

目前最后更新时间：4个月前

印象：

组件数量是最少的，连ActionSheet都没有你敢信？反而是有一些纯js组件，比如倒计时等，还有纯css声明，比如文本截断，还有一些组件，比如购物车为空的一张图，比如一张遮罩就成了一个组件，比如页底的“到页底啦”提示，等等，这些完全没有必要做成组件。

Wux Weapp

star：3011

github：https://github.com/wux-weapp/wux-weapp/

官网：https://wux-weapp.github.io/wux-weapp-docs

开发者：个人（skyvow）

目前最后更新时间：2个月前

印象：

虽然是个人作品，但是组件却是最多的，而且基本上没有什么“废物”组件，新颖的组件不少，比如“骨架屏”，而且自带日历等。

ColorUI

star：2071

github：https://github.com/weilanwl/ColorUI/

官网：https://www.color-ui.com/

开发者：个人（weilanwl）

目前最后更新时间：21天前

印象：

这个UI就有意思了，它跟其他组件走的路线不一样：

就跟它的名称一样，它更强调色彩，包括背景色、文本色、边框阴影，都能给你做出来一系列推荐方案。

它的组件的分类法是“操作条”、“导航栏”“表单”“轮播”这样的分类，不要以为里面的内容很少，比如“操作条”，凡是条形的UI在这里几乎全能找到，而且配色都比较漂亮，尤其是底部导航条的中央大“发布”按钮，也特意给你做了出来。导航栏里面，navbar、tabbar都可以找到。

优势&劣势

说到最后，到底我们怎么选型呢？一句话评价一下这5个组件吧：

Vant Weapp：

• 优势：版本升级最勤快，开发团队实力最强，组件数量足以应对交互不多的APP。

• 劣势：组件数量不是最多的，画面比较糙。

iView Weapp

• 优势：跟Vant Weapp有个哥哥叫Vant一样，iView Weapp也有一个哥哥叫iVew，说明开发者实力也是不用担心。美观度大于Vant Weapp。

• 劣势：缺少选择器组件，如果你很需要这个组件，那么你可能要放弃iView。

MinUI

• 优势：优势是……简单？果然跟项目名称一样，Min，最小。

• 劣势：美丽说的这个项目，应该是公司的程序员业余用来练手的一个项目，至今也有4个月没见动静了，是几个项目中最惨的。我认为应该将这个组件库作为末选，实在没办法才去考虑。

Wux Weapp

• 优势：组件库足够多，没有废物组件，之前还在别处见到有人找小程序的“骨架屏”，Wux正好有。如果你的项目交互非常多，我们能想到的通用组件几乎全能用得到，那么，选Wux Weapp会给你节省开发时间，也减少维护成本。

• 劣势：笼统说，没有缺点。如果细说，可以说，它的手册的效果是用视频演示的，不够直观。当然了，其他的那几个组件库的演示也不是说就是完美的，如果你觉得Wux好用，手册的问题可以克服。

ColorUI

• 优势：当然是色彩华丽，如果你对配色完全没有概念，可以试试这款组件库。它的组件大多是做了视觉优化的，你可以直接拿过来就用。

• 劣势：交互性的组件不够多。

个人推荐

其实上面也说的比较清楚了，相信各位有了一定的认识了。

我个人推荐的话，就是：

1. 记住，小程序组件的优势是“天生可拆分”，所以，没必要太纠结选哪个，因为你完全可以从这5个组件库都挑选一些组件，最后凑成一个项目！
2. 如果你无理由钟爱某款，那就选某款。
3. 如果喜欢大厂，就从Vant和iView选一个，它俩之间，要画面略好就iView，要选择器就Vant。
4. 如果无所谓大厂不大厂，就Wux，几乎无缺点。
5. ColorUI的组件大多是无交互的组件，所以可以和其他的组件搭配使用，就比如底部导航条，它的点击事件和高亮，你用原生代码可以轻松写出来，这时候，组件的美观度才是第一位的，所以优先选择ColorUI的底部导航条当然OK！

所以我的操作建议是：

1. 任何组件先去ColorUI里找，除非你明确知道ColorUI里肯定没有。
2. ColorUI里没有的组件优先去Wux里找，如果感觉视觉不够漂亮或者功能少那么一丢丢，比如你想用ActionSheet，而且希望弹出层带标题，但是你找的这个组件库的ActionSheet不带标题，那么你大可以看看其他的组件库。
3. 同样的组件不要混着用，比如ActionSheet不要同时用多个库的组件，这样不统一显得很弱智。

作者：microkof

链接：https://www.jianshu.com/p/2e94c3b3f11c

来源：简书

著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。