地图中的Javascript地图正在等待响应

Question

我有一系列问题
每个问题都有一些答案，这些答案是要上传的一些文件
一切顺利，而不是API调用没有等待Promise.all完成。

以下是步骤：

1. 通过问题数组进行映射，如果问题是image类型，则获取所有文件并尝试上传。

2. 上传后，解决上传的所有承诺，并为该问题添加答案Promise.all();的结果

3. 在所有问题的循环准备好后，进行API调用以保存到DB中，DB现在不等待上载所有文件并解决该数组中的所有问题。

export function sendReview (taskId, companyId, questions, navigation) {
return async (dispatch) => {

dispatch(actions.sendReview.pending());
try {
let user = await getUser();
user = JSON.parse(user);

questions.map(async question => {
if (question.type === 'image') {
let images = question.answer;
if (images.length > 0) {
const results = images.map(async image => {
return await imageApi.upload(image).then(res => {
return res.url;
});
});
question.answer = await Promise.all(results).then(completed => {
return completed;
});
}
}
});

const data = await tasksApi.sendReview({
task_id: taskId,
company_id: companyId,
user_id: user.id,
questions: JSON.stringify(questions)
});
if (data.status === 201) {
markAsCompleted(taskId);
navigation.navigate('MyTasks');
dispatch(actions.sendReview.success({}));
}
else {
dispatch(actions.sendReview.error());
}
} catch (err) {
dispatch(actions.sendReview.error(err));
}
};
}

这是所使用的函数。

我如何确保.map()中的所有项目都准备好了，然后再调用API？

Answer 1

给你一个我很久以前做的代码的例子：

await Promise.all((await readdir(repoPath, "utf8")).map(async file => {
if (!/.mjs$/.test(file)) return;
const filePath = `${repoPath}/${file}`;
log(`importing "${file}"`);
const module = await import(filePath);
const meta = {
repository,
file,
filePath,
description: module.description || {}
};
module.default((...args) => createModule(meta, ...args));
}));

如果您有异步映射处理程序，则需要记住，生成的映射的内容包含promise。

Promise.all()将为您提供帮助。

在你的情况下，你所需要做的就是改变：

questions.map(async(question) => {
if(question.type === 'image'){
let images = question.answer;
if(images.length > 0){
const results = images.map(async (image) => {
return await imageApi.upload(image).then(res => {
return res.url;
});
});
question.answer = await Promise.all(results).then((completed) => {
return completed
});
}
}
});

如下所示：

await Promise.all(questions.map(async(question) => {
if(question.type === 'image'){
let images = question.answer;
if(images.length > 0){
const results = await Promise.all(images.map(async (image) => {
return await imageApi.upload(image).then(res => {
return res.url;
});
}));
question.answer = results.then((completed) => {
return completed
});
}
}
}));

Answer 2

使用Promise.all在数组中等待承诺

Promise.all(questions.map(...))