基于promise.all实现wx.request微信小程序同步
2019-05-28 本文已影响0人
喵呜Yuri
微信小程序的wx.request方法是异步的,并且没有像ajax一样有个async的设置参数去设置同步执行。
但是我这儿有个类似这样的需求:
var postDataArr = ['aaa','bbb','ccc'];
var getEndData = [];
for(var i = 0;i<postDataArr .length;i++){
return new Promise(function (resolve, reject) {
wx.request(
......
success:function(res){
getEndData.push(res);
}
)
})
}
return getEndData;//得到处理数据
wx.request作为异步请求方法,显然我们拿到的getEndData依然是个空。
我的解决方式是用promise.all
promise的概念
promise的作用简而言之就是Promise的它的多重链式调用,可以避免层层嵌套回调。假设我们在第一次ajax请求后,还要用它返回的结果再次请求呢?promise就非常有用了。
function sendRequest(url, param) {
return new Promise(function (resolve, reject) {
request(url, param, resolve, reject);
});
}
sendRequest('test1.html', '').then(function(data1) {
console.log('第一次请求成功, 这是返回的数据:', data1);
return sendRequest('test2.html', data1);
}).then(function(data2) {
console.log('第二次请求成功, 这是返回的数据:', data2);
return sendRequest('test3.html', data2);
}).then(function(data3) {
console.log('第三次请求成功, 这是返回的数据:', data3);
}).catch(function(error) {
//用catch捕捉前面的错误
console.log('sorry, 请求失败了, 这是失败信息:', error);
});
那我所请求的循环和这个有所不同,我不知道要then多少次。
promise.all是怎么实现的呢?
Promise.all(iterable)方法返回一个 Promise
实例,此实例在 iterable
参数内所有的 promise
都“完成(resolved)”或参数中不包含 promise
时回调完成(resolve);如果参数中 promise
有一个失败(rejected),此实例回调失败(reject),失败原因的是第一个失败 promise
的结果。
var promise1 = Promise.resolve(3);
var promise2 = 42;
var promise3 = new Promise(function(resolve, reject) {
setTimeout(resolve, 100, 'foo');
});
Promise.all([promise1, promise2, promise3]).then(function(values) {
console.log(values);
});
以下是我在实际项目引用中的代码:
var PromiseAllArr = [];//*********************用来存多个Promise
for (var k = 0; k < detail_postData.initData.length; k++) {
var v = detail_postData.initData[k];
var data_ = {
tran_no: v.tran_no,
info_id: v.infoid
};
PromiseAllArr.push(
new Promise(function (resolve, reject) {
wx.request({
url: common.BASE_URL + 'XXXXX',
data: data_,
method: 'post',
dataType: 'json',
header: {
'access_token': AUTH_TOKEN,
'user_key': USER_KEY
},
success: function (getinfo) {
//如果返回数据是正确的
if (getinfo.data.code == '1') {
return resolve(getinfo);
} else {
//如果返回数据是错误的
return reject(getinfo.data.msg);
}
},
fail: function (error) {
return error;
},
complete: function (complete) {
return complete;
}
})
})
)
//*********************Promise存好了,现在来用
Promise.all(PromiseAllArr).then(function (values) {
console.log(values);
}).catch(reason => {
console.log(reason)
});
当PromiseAllArr中的Promise请求错误,就会返回第一个报错的Promise请求中的reject,返回到catch函数里.
当PromiseAllArr中的Promise全部请求成功,则会返回到then函数中,返回的是由各Promise请求成功返回的数组。