您的位置:首页 > 移动开发 > 微信开发

微信小程序上传图片并预览,指定总共最多能上传几张

2018-09-11 19:39 288 查看
wxml
hljs php">      <view wx:for="{{tempFilePaths}}"><image src="{{item}}"></image></view>
<view wx:if="{{tempFilePaths.length<=4}}"  bindtap='chooseimg'>+</view>
//图片超过四张时上传按钮消失
</view>```

#####js
```  chooseimg:function(){
let _this = this;
let len=0;
if (_this.data.tempFilePaths!=null){
len = _this.data.tempFilePaths.length;
}//获取当前已有的图片
wx.chooseImage({
count: 5-len, //最多还能上传的图片数,这里最多可以上传5张
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
var tempFilePaths = res.tempFilePaths
let tempFilePathsimg = _this.data.tempFilePaths
//获取当前已上传的图片的数组
var tempFilePathsimgs=tempFilePathsimg.concat(tempFilePaths)
//把当前上传的数组合并到原来的数组中
_this.setData({
tempFilePaths: tempFilePathsimgs
})

},

fail:function(){
wx.showToast({
title: '图片上传失败',
icon: 'none'
})
return;
}
})
},
阅读更多
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: