javascript - 如何处理 Promise 数组 then/catch

标签 javascript es6-promise

我不知道如何使用 JS Promise 来解决这种情况。

假设我有一些文章,我想发送补丁请求来更新它们。我每篇文章发送一个请求。如果一篇文章的请求成功,那么我会更新该文章,但如果请求失败,那么我会以不同的方式更新该文章。另外,我想向用户显示一条消息,告知所有文章是否已正确更新。

这不是我的真实场景,这可能是一个奇怪的例子。但这就是我想在我的 React 应用程序中实现的目标。

这是我现在正在尝试做的事情:

const saveArticles = articles => {
  const promises = [];

  articles.forEach(article => {
    const promise = axios
      .patch('/articles', article)
      .then(() => updateArticleUi(article))
      .catch(() => updateArticleUiWithError(article));

    promises.push(promise);
  });

  Promise.all(promises)
    .then(() => tellTheUserThereWasNoErrors())
    .catch(() => tellTheUserThereWasSomeErrors());
};

这不起作用,因为 Promise.all 始终执行 then 回调,无论所有 Promise 是否成功。

谢谢!

最佳答案

您的 updateArticleUiupdateArticleUiWithErrors 应该具有各自的返回值,以便您在查看结果数组时区分是否存在错误:

function updateArticleUi(article) {
  …
  return {success: true};
}
function updateArticleUiWithError(article, error) {
  …
  return {success: false};
}

function saveArticles(articles) {
  const promises = articles.map(article => {
    return axios.patch('/articles', article).then(() =>
      updateArticleUi(article)
    , err =>
      updateArticleUiWithError(article, err)
    );
  });

  return Promise.all(promises).then(results => 
    if (results.every(res => res.success)) {
      tellTheUserThereWasNoErrors();
    } else {
      tellTheUserThereWasSomeErrors();
    }
  });
}

关于javascript - 如何处理 Promise 数组 then/catch,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52259832/

相关文章:

java - Mozilla Rhino 教程

javascript - 我想将 Node.js 中呈现的值用于 Google Chart

javascript - Remove 实际上是在 Promise 解决后删除一个 div

javascript - 生成器可以使用异步函数吗?

Firebase V9 离线时不会在 catch 中给出错误

javascript - 单击时淡入元素并隐藏更多按钮(如果为空)

javascript - 有什么方法可以覆盖参数的 getter/setter 性质吗?

javascript - 我如何修改 tumblr 小书签以发布到特定的 tumblr 博客?

javascript - 使用 Promise.catch() 和在 try...catch 中包装 Promise 有什么区别?

javascript - Promise reject() 导致 "Uncaught (in promise)"警告