如何连续进行 graphql 调用?反应阿波罗

Posted

技术标签:

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

我在 hocreact-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) )) 【参考方案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 计算它们。

【讨论】:

以上是关于如何连续进行 graphql 调用?反应阿波罗的主要内容,如果未能解决你的问题,请参考以下文章

反应中的奇怪错误-使用阿波罗/客户端-graphql

与石墨烯后端反应阿波罗中 graphql 接口类型的常见字段

表达 http:graphql 突变上的 500 错误以在反应中从阿波罗客户端创建用户

如何在“GraphQL链接模式(客户端和服务器)的反应母语

如何在没有参数的情况下进行graphql突变? (Vue 阿波罗)

http解析异常阿波罗Graphql