在forEach循环中使用async函数时,循环不会等待异步操作完成就继续执行下去。这意味着,在获取异步回调数据时,很可能这些异步操作还没有完成,因此获取的数据是空的。
checkValues.value.forEach(async (ele) => {
console.log('ele', ele);
const res = await createOrder({
phone
})
if (res.data.data.code == 1) {
orderId.value.push(res.data.orderid)
}
})
console.log('订单orderId.value', orderId.value);
例如这样,orderId.value获取不到数据
解决方法:
使用for...of循环代替forEach循环,因为for...of支持异步操作的等待
for (const ele of checkValues.value) {
const res = await createOrder({
phone
});
if (res.data.data.code == 1) {
orderId.value.push(res.data.orderid);
}
}
console.log('订单orderId.value', orderId.value);
这样就可以获取到了,但是这种方法会按顺序执行每个订单的创建操作,可能会导致性能问题,如果数据很多的话。可以考虑使用Promise.all或者Promise.allSettled:
const promises = checkValues.value.map(ele => createOrder({
phone
}));
const results = await Promise.allSettled(promises);
results.forEach(result => {
if (result.status === 'fulfilled' && result.value.data.data.code == 1) {
orderId.value.push(result.value.data.orderid);
}
});
console.log('订单orderId.value', orderId.value);