来这里找志同道合的小伙伴!
前 言
转眼间,Taro UI 发布已有半年,在此期间,不断完善组件库的功能和特性,新增了许多组件和小工具,包括但不限于:
新增组件
在 1.0 版本发布之后,又陆续新增了如下十一个组件:
其中,在社区里呼声最高的组件,非日历组件所属。由于日历组件复杂度偏高,要适配多端环境难度偏大,纵观市面上的小程序 UI 组件库,包含日历组件的寥寥无几。
适配多种小程序,如百度小程序
在 1.0 版本适配微信小程序时,遇到了很多困难。比如:
克服完上述微信小程序的困难后,小程序的适配工作大多是解决样式和某些API的差异。得益于 Taro 良好的支持,Taro UI 的适配工作暂时告一段落。
新增自定义主题功能
Taro UI 1.0 发布时只有一套默认的主题配色,为满足业务和品牌上多样化的视觉需求,UI 库支持一定程度的样式定制。
Taro UI 的组件样式是使用 SCSS 编写的,如果你的项目中也使用了 SCSS,那么可以直接在项目中改变 Taro UI 的样式变量。
新建一个主题样式文件(例如 custom-variables.scss)并覆盖默认主题变量:
之后在项目的入口文件中引入以上的样式文件即可(无需重复引入组件的默认样式)。
目前,Taro UI 2.0 还额外定制了京东主题和 7Fresh 主题色,可通过扫描以下二维码查看。
京东主题:
7Fresh 主题:
新增主题生成器
为了让开发者更好地使用自定义主题功能,同时新增主题生成器。开发者可以使用该工具方便地定制 UI 主题。
主题生成器地址:
https://nervjs.github.io/taro-ui-theme-preview/
效果预览:
新增 Issue Helper
虽然已经配置了 Issue Template,但仍有部分开发者没有根据规范填写 Issue。排查问题时经常需要再次询问版本号信息、复现代码等等,这不仅会消耗维护项目的精力,还降低了 Issue 处理效率。因此在参考了 Ant 和 iView 团队的做法之后,制作了 Issue Helper 页面,帮助开发者更规范地填写 Issue。
Taro UI Issue Helper 地址:
https://nervjs.github.io/taro-ui-issue-helper/
此外,深知重复制作 Issue Helper 页面也是一件很浪费劳动力的事情。于是将 Issue Helper 封装成一个命令行工具,开发者可以通过简单配置 config.js,执行命令 issue-helper build 就可以生成所需要的页面。
Issue Helper 工具仓库地址:
https://github.com/jimczj/issue-helper
未来计划
后记
感谢大家对 Taro UI 的使用与反馈,他们致力于将 Taro UI 打造成高质量组件库,不断丰富组件功能与特性,紧跟 Taro 的步伐适配更多平台。
最后,欢迎关注并使用他们的组件库:
https://github.com/NervJS/taro-ui
感谢您的阅读,本文由 凹凸实验室 版权所有。
如若转载,请注明出处:凹凸实验室
(https://aotu.io/notes/2019/02/25/taro-ui-2.0/)