关于uni-app的ui库、ui框架、ui组件

首先需要一个认知,传统vue的库,只是for web的,不能跨6端。而微信小程序的库,虽然可以跨到app,但不能跨到h5和百度支付宝小程序。
比如element ui只能用于h5,而vant ui有h5版和小程序版,h5版只能用于h5,而小程序版只能用于微信和app(uni-app在app侧支持使用小程序ui组件)。
想要6端通用的ui框架,需要基于vue的无dom操作的库。最好还是纯flex布局。
下图对跨端兼容性的说明比较清晰。

虽然很多传统vue库不跨端,但这并不意味着uni-app的生态缺乏,事实相反。

具体如下: 

  1. uni-app内置组件是最常用的,与微信内置组件相同。https://uniapp.dcloud.io/component/README
  2. 扩展组件是uni ui,在组件的文档里有专门的扩展组件分类。https://uniapp.dcloud.io/component/README
    扩展组件支持单个从插件市场下载,也支持npm整体引入uni ui,见http://ext.dcloud.net.cn/plugin?id=55
  3. 更多ui库和模块,见插件市场,https://ext.dcloud.net.cn。玲琅满目,除了组件形式,还有很多页面模板和项目模板拿来即用。 
  4. 其他基于vue的无dom库也支持,包括graceui、zanui-mpvue、iview-mpvue。但注意后2者不是纯flex布局。 

另外如果你在App侧使用nvue,也支持weex ui。 

虽然不建议,但如果你确定只开发微信小程序和App,也可以使用微信的自定义组件ui,这里是vant ui weapp版的使用指南:https://ask.dcloud.net.cn/article/35128

最后,请开发者务必牢记基础组件的作用,基础组件的性能是高于扩展组件的
这和web开发不一样,web开发基本上不用基础组件,都是找一个ui库,全部组件都包含。
但uni-app体系不是这样,uni-ui库全部都是扩展组件,不含基础组件。 

我们的建议是:开发时首先用基础组件,不能及的部分再通过扩展组件补充,不要把整个项目全部都构建在某个ui框架下。

原文地址:https://ask.dcloud.net.cn/article/35489

展开阅读全文

没有更多推荐了,返回首页