如何等待多个graphql突变完成然后调用另一个函数答案

【问题标题】：How to wait for multiple graphql mutations to finish then call another function如何等待多个graphql突变完成然后调用另一个函数
【发布时间】：2020-11-07 02:37:45
【问题描述】：

基本上我有一个对象数组，根据该数组的长度，我需要像这样为每个实例做一个突变：

arrayOfObjects.forEach((object) => {
  someGraphQlMutation({
    variables: object.id,
  });
});

-----------------

const [someGraphQlMutation] = useMutation(
    SOME_GRAPHQL_MUTATION,
    {
        onCompleted: (data) => {
            // callback
        }
    }
);

但是，在所有的突变完成之后，我需要调用另一个函数。在调用回调函数之前，我需要等待迭代突变完成。我可以在这种情况下使用Promise.all 吗？

【问题讨论】：

从技术上讲，您可以只创建一个包含您需要的所有查询的单一突变，但 useMutation 听起来像 hook，所以不，在这种情况下您不能使用 Promise.all
应该避免这种模式，因为重复的网络往返和累积延迟（更不用说当一个突变失败但它们打算作为一个组执行时错误处理的复杂性）。创建一个接受数组并在服务器上处理迭代的新突变。

标签： javascript reactjs graphql graphql-mutation

【解决方案1】：

是的，你可以使用 Promise.all 来等待所有的变化：

const [someGraphQlMutation] = useMutation(SOME_GRAPHQL_MUTATION);
const doEverything = async () => {
  try {
    const results = await Promise.all(arrayOfObjects.map(object => {
      return someGraphQlMutation({ variables: object.id });
    }));
    // results will be an array of execution result objects (i.e. { data, error })
    // Do whatever here with the results
  } catch (e) {
    // Handle any errors as appropriate
  }
}

【讨论】：

我不相信这行得通，someGraphQlMutation 不会返回承诺