Apollo (GraphQL) 在查询中获取多个元素

Posted 2023-03-08

【中文标题】Apollo (GraphQL) 在查询中获取多个元素

【英文标题】：Apollo (GraphQL) fetch more than one element in a query

【发布时间】：2017-11-10 03:45:09

【问题描述】：

我可以在 GraphQL 查询中获取多个元素吗？我有很多产品列表数据，我想获取，例如，我的组件中的三个产品。我有一系列所需的产品 ID，我可以将其传递给查询吗？这是我对一种产品的查询：

query ProductInCartQuery($id: ID!)
  Product(id: $id)  
   id
   name
   price
 

但我不认为我可以将它放在一个函数中并为三个产品执行例如三次。

【问题讨论】：

请编辑您的帖子以包含您的架构代码。

当然可以...

怎么样？我在编辑中添加了我的查询。

【参考方案1】：

为您拥有的每种类型提供两种查询是很常见且非常有用的：

获取具有id 或其他唯一字段的单个节点的查询，在您的情况下为Product（您已经拥有此）。

根据不同的过滤条件获取多个节点的查询，我们称之为allProducts。

那么您有两个选项可以在一个查询中获取多个产品。

首先，您可以多次使用Product 查询并使用GraphQL Aliases 以避免响应数据中的名称冲突：

query ProductInCartQuery($firstId: ID!, $secondId: ID!)
  firstProduct: Product(id: $firstId)  
    id
    ... ProductInfo
  

  secondProduct: Product(id: $secondId)  
    id
    ... ProductInfo
  

  fragment ProductInfo on Product 
    name
    price
  
 

您可以根据要查询的 id 动态构建此查询字符串。但是，如果不同 id 的数量是动态的，最好使用 allProducts 查询和必要的过滤器设置：

query filteredProducts($ids: [ID!]!) 
  allProducts(filter: 
    id_in: $ids
  ) 
    ... ProductInfo
  


fragment ProductInfo on Product 
  name
  price

你可以在我为你准备的this GraphQL Playground自己尝试一下。更多背景信息请见in this article。

【讨论】：

谢谢！过滤器参数正是我需要的;)

【参考方案2】：

要将产品 ID 添加到查询中，您可以定义 input 类型。请参阅cheat sheet。

所以客户端上的查询可能如下所示：

query ProductsInCartQuery($productIds: ProductIds!) 
  Products(productIds: $productIds) 
    id
    name
    price
  

在服务器上，您使用input 类型定义架构，如下所示：

input ProductIds 
  ids: [ID!]


type Query 
  Products(productIds: ProductIds!) 
    id
    name
    price
  


schema 
  query: Query