vant weapp 多选上传图片_微信小程序：使用vant实现上传图片功能

使用vant的Uploader组件

我们使用上传的组件是vant-weapp,这样可以大大的提高我们的开发效率。使用Uploader组件首先在全局配置app.js引入该组件，也可以在页面配置json中引入

"usingComponents": {

"van-uploader": "/path/to/vant/uploader/index",

},

复制代码

新建uploader相关page，在uploade.wxml增加我们的上传组件

复制代码

file-list绑定的是上传的文件列表，bind:after-read绑定图片读取后的事件，bind:delete绑定删除图片事件,multiple是否支持多上传功能，默认为false,我们还需要在uploade.js增加相关的逻辑

上传地址配置

配置上传的初始化值

/**

* 页面的初始数据

*/

data: {

fileList: [] //需要上传的图片列表

},

复制代码

新建项目配置文件config/index.js

export default {

uploadUrl: `***************` //你的上传到服务器地址

}

复制代码

在使用的页面中导入配置文件

import config from 'path/to/config/index' //相对路径

复制代码

封装上传图片函数

为每上传一张图片返回promise任务，这里建议封装写在beh