最近在做微信公众号项目开发,其中有调用相册,并还展示显示的图片,下面是我写的代码,出现的结果是选三张图片,最多就显示出最好一张图,不知道该怎么解决,想请教一下各位
xiangce () {
var _url = window.location.href
console.log(_url)
var that = this
this.$http.post('/wxpay/shopscan', {url: _url})
.then(res => {
console.log(res)
var res = res.data.data;
var appId = res.appId;
var timeStamp = res.timestamp;
var nonceStr = res.nonceStr
var signature = res.signature
var signType = res.signType
var pk = res.packageStr
var paySign = res.paySign
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: appId, // 必填,公众号的唯一标识
timestamp: timeStamp , // 必填,生成签名的时间戳
nonceStr: nonceStr, // 必填,生成签名的随机串
signature: signature,// 必填,签名,见附录1
jsApiList: ['chooseImage', 'downloadImage', 'uploadImage', 'getLocalImgData'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
});
// config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
wx.chooseImage({
count: 5, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
console.log(res)
var localIds = res.localIds; // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
console.log(localIds)
console.log(that)
that.syncUpload(localIds)
}
});
wx.error(function (res) {
alert("error:" + JSON.stringify(res));
});
}, err => {
console.log(err)
})
.catch(err => {
console.log('abbbbb')
})
},
async syncUpload (localIds) {
console.log(localIds)
var localId = localIds.pop();
wx.uploadImage({
localId: localId.toString(), // 需要上传的图片的本地ID,由chooseImage接口获得
isShowProgressTips: 1, // 默认为1,显示进度提示
success: function (res) {
console.log(res)
//res.serverId 返回图片的服务器端ID
var serverId = res.serverId; // 返回图片的服务器端ID
wx.downloadImage({
serverId: serverId, // 需要下载的图片的服务器端ID,由uploadImage接口获得
isShowProgressTips: 1, // 默认为1,显示进度提示
success: function (res) {
var localId = res.localId; // 返回图片下载后的本地ID
wx.getLocalImgData({
localId: localId, // 图片的localID
success: function (res) {
console.log(res)
var localData = res.localData; // localData是图片的base64数据,可以用img标签显示
// localData = localData.replace('jgp', 'jpeg');//iOS 系统里面得到的数据,类型为 image/jgp,因此需要替换一下
// $('#cc img').attr("src", localData);
console.log(localData)
console.log(localIds.length)
var _img = '<li class="li"><img src="' + localData + '" alt=""><span class="del"></span></li>'
$('#ul').append(_img)
if(localIds.length > 0){
console.log('123')
window.setTimeout(function(){
that.syncUpload(localIds);
},100);
}else{
window.setTimeout(function(){
console.log('123456')
},100);
}
}
});
}
});
}
});
},