Vant Weapp 1.0 正式版发布

阅读数:1 2020 年 3 月 15 日 20:19

Vant Weapp 1.0 正式版发布

Vant Weapp 1.0 来了

2018 年 8 月 11 日,我们发布了 Vant Weapp 的首个版本。16 个月以来,我们收到了 27 位开发者贡献的 1000 多次提交,也处理了 1200 多个 issue,发布了 50 多个版本。Github 的 star 数从 5k 上升到了 11k,长期是 Github 上 star 数最多的第三方小程序 UI 组件库。

Vant Weapp 1.0 正式版发布

现在,我们很高兴向大家介绍 Vant Weapp 1.0 版本

经过 2 个月的开发与 beta 测试,我们为大家带来了 11 个全新的组件,重构了多个现有组件,增加了覆盖所有组件的主题定制特性。并且,为了配合 Vant 家族的发展,正式将包名变更为 @vant/weapp

大家可以扫描下方小程序码体验 Vant Weapp 1.0 示例

Vant Weapp 1.0 正式版发布

一、新版本介绍

1.1 新的组件

在 Vant Weapp 1.0 版本中,我们新增了 11 个实用的基础组件:

  • Grid 宫格,用于展示内容或进行页面导航
  • Image 图片,增强版的 Image 标签,支持图片懒加载与加载失败提示
  • Circle 环形进度条,告知用户当前的状态和进度
  • Overaly 遮罩层,用于强调特定的页面元素,并阻止用户进行其他操作
  • Divider 分割线,区隔内容的分割线
  • Sticky 粘性布局,与 CSS 中 position:sticky属性实现的效果类似
  • Skeleton 骨架屏,在待加载区域展示的占位区块,提供界面加载过程中的过渡效果
  • IndexBar 索引栏,通讯录中的字母索引栏,用于长列表快速索引
  • Uploader 文件上传,上传一个或多个文件
  • CountDown 倒计时,用于显示活动倒计时、短信验证码等
  • DropdownMenu 下拉菜单,用于列表的分类选择、筛选及排序

Vant Weapp 1.0 正式版发布

1.2 样式定制

在 1.0 迭代计划确定之初,我们就不断思考这样一个问题 – 该如何给用户提供动态切换主题样式的功能呢?

微信小程序的环境是非常特殊的。不具有动态加载代码的机制,同时微信又限制了代码的主包大小和总大小。传统的基于预设的样式定制过于臃肿,不再适合微信小程序的环境。

微信小程序自定义组件的组件模型相当于一个简化版的 Shadow DOM,幸运的是,小程序也支持了 CSS 自定义属性 的特性。最终,我们基于 CSS 自定义属性设计了样式定制的方案,开发者使用灵活、方便,组件维护也更简单。

从 1.0 版本开始,Vant Weapp 中的所有组件都支持通过 CSS 组定义属性 进行样式定制,具体使用姿势可查看更新日志。

Vant Weapp 1.0 正式版发布

1.3 不兼容更新

1.0 版本中包含少量不兼容更新,主要是命名调整和移除个别属性。对于正在使用 0.x 版本的项目,请按照更新日志依次检查,大部分项目可以无痛升级

三、未来

Vant Weapp 会积极探索与腾讯云开发结合的可能性,为大家带来更好的使用体验。不久,我们将再次与大家见面。

写在最后的话

感谢社区长期以来为 Vant Weapp 提供的贡献与反馈,让我们始终与开发者站在一起。如果您在使用 Vant Weapp 的过程中遇到任何问题,欢迎在 Github 向我们反馈。


Vant Weapp 1.0 的主要贡献者为 (按首字母排序):@Andyliwr @aphasic @chenjiahan @creeperdance @Eamonnzhang @Fyerl @JakeLaoyu @jerryni @kongyeah @Lindysen @linrz @rex-zsd @thoamsy @ylethe 。

评论

发布