在vue中使用微信jssdk的getLocalImgData怎么让多张图片显示

Question

正常情况下在 ios 上，使用for循环能多张图片显示，但是在vue中使用for循环的话，只能单次选择一张显示一张，选择多张的话就无法显示图片了。

if(window.__wxjs_is_wkwebview) {    //判断ios是不是用的 wkwebview 内核
    // ios 转为 base 64
    for(let i = 0; i < localIds.length; i++) {
        _this.wx.getLocalImgData({
            localId: res.localIds[i],
            success: function(res) {
                let localData = res.localData;
                localData = localData.replace('jgp', 'jpeg');
                _this.previewImg.push(localData);
            },
            fail: function() {
                Toast('选择失败');
            }
        })
        _this.uploadImg(res.localIds[i]);
    }
} else {
    localIds.forEach(item => {
        _this.previewImg.push(item);
        _this.uploadImg(item);
    })
}

Answer 1

已解决，我个人认为这属于在for循环里添加了一个异步请求类型的，所以我让他每次执行完毕后再执行下一次操作，其中用到了async 和 await，将异步变为同步去执行。
下面是成功代码：
方法都是写在 methods 中的：

---

chooseImg() {

let _this = this;
this.wx.chooseImage({
    count: 9,
    sizeType: ['original', 'compressed'],   // o：原图，c：压缩图
    sourceType: ['album', 'camera'],        // a：来自相册，c：来自相机
    success: function(res) {
        var localIds = res.localIds;
        // 判断设备
        if(window.__wxjs_is_wkwebview) {    //判断ios是不是用的 wkwebview 内核
            // ios 转为 base 64
            _this.iosPreview(localIds);
        } else {
            localIds.forEach(item => {
                _this.previewImg.push(item);
                _this.uploadImg(item);
            })
        }
    },
    fail: function() {
        // 这个是ui组件的弹出框，不用管
        Toast({duration: 700, message: '图片选择失败,请重新选择'});
    }
})  

},

---

// 定义 ios 中使用的选择图片方法

// this.uploadImg(item) 是写的上传图片方法，不用管，这里讲的是选择图片

async iosPreview(localIds) {

for(var i = 0; i < localIds.length; i++) {
    this.uploadImg(item); // 这个不用管
    await this.readImage(localIds[i]);
}

},

// 定义 ios 中使用的选择图片方法

// previewImg 是vue的data方法中定义的用来存放选择成功的图片的

readImage(item) {

let _this = this;
return new Promise((resolve, reject) => {
    this.wx.getLocalImgData({
        localId: item,
        success: function(res) {
            let localData = res.localData;
            localData = localData.replace('jgp', 'jpeg');
            _this.previewImg.push(localData);
            
            resolve('done!');
        },
        fail: function() {
            // 这个是ui组件的弹出框，不用管
            Toast.text({duration: 700, message: '选择多张失败'});
        }
    })
})

}

Answer 2

不错，解决了我的问题