调用JSSDK上传图片，上传单独文件时并未有异常，在多图上传时发现getLocalImgData未报错，并在开发者工具中控制台成功打印获取到的数据，但是回调方法并未执行。
this.$wx.ready(function() { that.$wx.chooseImage({ count: 9 - that.imgList.length, sizeType: ["compressed"], sourceType: ["album", "camera"], success: function(res) { let localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片 that.loading.uploadLength = localIds.length; window.console.log("累计上传", localIds); // 分批上传图片 for (var i = 0; i < localIds.length; i++) { window.console.log("即将", i); that.$wx.getLocalImgData({ localId: localIds[i], // 图片的localID success: function(res) { window.console.log("开始上传", res); // that.doUploadImage(res.localData); }, fail: function(err) { window.console.error(err); that.loading.show = false; } }); } }, fail: function() { that.loading.show = false; }, cancel: function() { that.loading.show = false; } }); |
单独上传控制台打印如下：
多图上传控制台打印如下：
在多图打印执行后在使用getLocalImgData中的打印并未执行。
问题可能是我使用vue的原因
借鉴问题：https://segmentfault.com/q/1010000019080941
调整代码后成功：
uploadImage() {varthat =this;// this.loading.show = true;this.$wx.ready(function() {that.$wx.chooseImage({count: 9 - that.imgList.length,sizeType: ["compressed"],sourceType: ["album","camera"],success:function(res) {let localIds = res.localIds;// 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片that.readImages(localIds);},fail:function() {that.loading.show =false;},cancel:function() {that.loading.show =false;}});});},async readImages(localIds) {for(vari = 0; i < localIds.length; i++) {awaitthis.doreadImage(localIds[i]);}},doreadImage(item) {let that =this;returnnewPromise(resolve => {that.$wx.getLocalImgData({localId: item,success:function(res) {let localData = res.localData;window.console.log(localData);resolve("done!");},fail:function(err) {window.console.error(err);}});});},this.$wx.ready(function() {
that.$wx.chooseImage({
count: 9 - that.imgList.length,
sizeType: ["compressed"],
sourceType: ["album", "camera"],
success: function(res) {
let localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
that.loading.uploadLength = localIds.length;
window.console.log("累计上传", localIds);
let tasks = [];
// 分批上传图片
for (var i = 0; i < localIds.length; i++) {
window.console.log("即将", i);
let p = new Promise((resolve, reject) => {
that.$wx.getLocalImgData({
localId: localIds[i], // 图片的localID
success: function(res) {
resolve(res)
window.console.log("开始上传", res);
// that.doUploadImage(res.localData);
},
fail: function(err) {
reject(err)
window.console.error(err);
that.loading.show = false;
}
});
})
tasks.push(p)
}
Promise.all(tasks).then(res => {
console.log(res, '循环输出结果')
})
},
fail: function() {
that.loading.show = false;
},
cancel: function() {
that.loading.show = false;
}
});
})
复制运行一下
let that = this;
that.$wx.chooseImage({
count: 9 - that.imgList.length,
sizeType: ["compressed"],
sourceType: ["album", "camera"],
success: res => {
let localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
that.loading.uploadLength = localIds.length;
window.console.log("累计上传", localIds);
// 分批上传图片
let tasks = []
for (let i = 0; i < localIds.length; i++) {
window.console.log("即将", i);
let p = new Promise((resolve, reject) => {
that.$wx.getLocalImgData({
localId: localIds[i], // 图片的localID
success: res => {
resolve(res)
},
fail: err => {
reject(err)
}
});
})
tasks.push(p)
}
Promise.all(tasks).then(res => {
window.console.log(res, '循环查询结果')
})
},
fail: function() {
that.loading.show = false;
},
cancel: function() {
that.loading.show = false;
}
});
})再试一下
window.console.log(res, '循环查询结果')