微信小程序多张图片上传组件

在实际开发中，很多时候都需要要上传图片，但是对于上传多张时需要一张张的上传，因为图片都可能比较大，这时就需要我们对上传图片的API进行进一步的处理，这样就解决了我们同时选择上传多张图片需求。所以为了方便以后使用，封装成一个特定的组件分享出来，也许很多能用到，也可能用不到，但是修改一下还是差不多一样可以用的。

多张图片上传的原理其实就是用递归的方法，在每一张上传完之后再继续上传下一张，直到完成为止。

新建一个uploadImages组件文件，定义组件的样式结构及js文件。

1.页面样式布局

view

css

图片插件这样大概就完成了，不过不是每一个人都是和我一样的情况，使用请具体项目分析。

实例请查看地址： https://github.com/kingbuwu/uploadImages

1、打开全能小组件，桌面上所用的十两个小组件，一个中组件。

2、点击添加小组件，选择第一个图片小组件添加想要的图片（最好是和壁纸同色的照片，小编用的是白色苹果LOGO），保存。

3、点击添加小组件，选择新天气小组件，把背景图选成白色，内容颜色看个人喜欢，选择城市，保存。

4、点击添加中组件，选择新时间组件， *** 作同色，把背景选成白色，保存。

需求：点击分享，d出遮罩层，可分享给好友，可保存图片分享，canvas中的图片自适应（缩放、裁剪）

技术：canvas 2，vant-weapp-ui

思路：计划将整个分享都写成一个自定义组件，由于一些bug，没能实现，部分还是需要写在页面中。

share组件:

share.wxml

share.js含有canvas绘制白色背景，canvas文本换行，绘制图片，图片原比例缩小裁剪，图片自适应，保存图片等方法

---