npm支持-vant组件库的使用

vant Weapp是有赞前端团队开发的小程序UI组件库，基于微信小程序的自定义组件开发，可以用来快速搭建小程序项目。

以引入图片为例子

在app.json中

引入图像并且点击图像触发事件

通过round属性可以设置图片变圆，注意当图片宽高不相等且fit为contain或scale-down时，将无法填充一个完整的圆形。

控制台：

显示图片的加载效果，加载图标，用于表示加载中的过渡状态。

Image组件提供了默认的加载中提示，支持通过loading插槽自定义内容。

Image组件提供了默认的加载失败提示，支持通过error插槽自定义内容。

外部样式类

类名	说明
custom-class	根节点样式类
image-class	图片样式类
loading-class	loading 样式类
error-class	error 样式类

在app.json中进行注册

样式：

效果：加载成功

加载失败：

在使用vant提供的组件时，只需要两个步骤：

1. 将组件在app.json中进行全部注册或者index.json进行局部注册
2. 在引入组件后，可以在wxml中直接使用组件

注意事项：

将app.json中的“style":"v2"去除，小程序的新版基础组件强行加上了许多样式，难以覆盖，不关闭将造成部分组件样式混乱。