如图：
直接上代码：
wxml:
<view class="weui-uploader">
<view class="weui-uploader__hd">
<view class="weui-uploader__title">图片上传</view>
</view>
<view class="weui-uploader__bd">
<block wx:for="{{imagesList}}" wx:key="*this" >
<view class="weui-uploader__file">
<image class="weui-uploader__img" src="{{item}}"></image>
</view>
</block>
<view class="weui-uploader__input-box">
<input class="weui-uploader__input js_file" type="file" accept="image/jpg,image/jpeg,image/png,image/gif" multiple="" bindtap='uploader' name="images"></input>
</view>
</view>
</view>
js:
// 图片上传
uploader:function(){
var that=this;
let imagesList=[];
let maxSize=1024*1024;
let maxLength=3;
let flag=true;
wx.chooseImage({
count: 6, //最多可以选择的图片总数
sizeType: ['original','compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success: function(res) {
wx.showToast({
title: '正在上传...',
icon: 'loading',
mask: true,
duration: 500
})
for(let i=0;i<res.tempFiles.length;i++){
if(res.tempFiles[i].size>maxSize){
flag=false;
console.log(111)
wx.showModal({
content: '图片太大，不允许上传',
showCancel: false,
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
}
}
});
}
}
if (res.tempFiles.length>maxLength){
console.log('222');
wx.showModal({
content: '最多能上传'+maxLength+'张图片',
showCancel:false,
success:function(res){
if(res.confirm){
console.log('确定');
}
}
})
}
if (flag == true && res.tempFiles.length <= maxLength){
that.setData({
imagesList: res.tempFilePaths
})
}
wx.uploadFile({
url: 'https://shop.gxyourui.cn',
filePath: res.tempFilePaths[0],
name: 'images',
header: {
"Content-Type": "multipart/form-data",
'Content-Type': 'application/json'
},
success:function(data){
console.log(data);
},
fail:function(data){
console.log(data);
}
})
console.log(res);
},
fail:function(res){
console.log(res);
}
})
},
更多技术问题，请看：http://sucai.gxyourui.cn/Home/Article/blog_detail/article_id/59.html
