如何连续进行 graphql 调用？反应阿波罗答案

【问题标题】：How do I make graphql calls in series? react-apollo如何连续进行 graphql 调用？反应阿波罗
【发布时间】：2018-05-27 10:42:45
【问题描述】：

我在 hoc 和 react-apollo 中编写 2 个查询。这是我的代码：

let queries = compose(
  graphql(gql`
    query getUnitSubcategories($input: UnitSubcategorySearchInput) {
      allUnitSubcategories(input:$input) {
        edges {
          node {
            unitSubcategoryId
          }
        }
      }
    }
  `, {
    name: 'subcategories',
    options: {
      variables: {
        input: {
          activeFlag: true,
        }
      }
    }
  }),
  graphql(gql`
    query getFinancialTransactions($input: FinancialTransactionLineSearchInput) {
      allFinancialTransactionLines(input: $input) {
        pageInfo {
          total
        }
        edges {
          node {
            financialTransaction {
              financialTransactionId
            }
          }
        }
      }
    }
  `, {
    name: 'financialTransactions',
    options: {
      variables: {
        input: {
          unitSubcategories: [
            ....
          ]
        }
      }
    }
  })
);

您可以看到我在第一个查询中得到了unitSubcategories，它们需要传递给第二个查询。因此，在第一个查询得到结果之前，我不想启动第二个查询。最好的方法是什么？

【问题讨论】：

我没有使用过 apollo 或 react-apollo，但是从你的代码中，graphql 返回了一个我认为你可以做到的承诺compose(graphql(request1 stuff).then(result => { return graphql(request 2 stuff with result data) }))

标签： apollo react-apollo

【解决方案1】：

您需要使用 skip 配置。见https://www.apollographql.com/docs/react/basics/queries.html#graphql-skip

在您的示例中，您可能希望在第二个查询中定义 skip 配置，如下所示：

{
  name: 'financialTransactions',
  skip: ({ unitSubcategories }) => !unitSubcategories,
  options: ({ unitSubcategories }) => ({
    variables: {
      input: {
        unitSubcategories
      }
    }
  })
}

您只希望在收到第一个查询的结果后运行第二个查询。然后使用options 作为函数，这样你就可以从props 计算它们。

【讨论】：