将对象作为参数传递给 GraphQL Mutation (graphql-request)

Posted 2023-03-08

【中文标题】将对象作为参数传递给 GraphQL Mutation (graphql-request)

【英文标题】：Passing Objects as Argument to GraphQL Mutation (graphql-request)

【发布时间】：2021-03-30 12:49:44

【问题描述】：

我在前端有一个非常基本的 graphql 突变，我发送到我的后端。我在graphql-request 上使用this code 作为指导。

使用原语它可以工作：

const mutation = gql`
    mutation EditArticle($id: ID!, $title: String) 
      editArticle(id: $id, title: $title) 
        id
      
    
  `

现在我还希望能够改变有关文章的一些元数据，存储在文章内的 meta 对象中：

...,
title: "Hello World",
meta: 
 author: "John",
 age: 32,
 ...

所以我的问题是：如何在使用 graphql-request 从前端发出请求时将非原始对象类型作为参数传递给突变？

我已经尝试过这样的事情：

const Meta = new GraphQLObjectType(
    name: "Meta",
    fields: () => (
      id:  type: GraphQLID ,
      name:  type: GraphQLString ,
      age ....
    ),
  )
   
const mutation = gql`
    mutation EditArticle($id: ID!, $title: String, $meta: Meta)  //??? I don't seem to get what goes here? 
      editArticle(id: $id, title: $title, meta: $meta) 
        id
      
    
  `

我也用GraphQLObjectType 尝试过，但我认为我在这里出错了（因为这是前端）。

PS：我查看了this answer，但我不明白/相信那里的解决方案可能不完整。

【问题讨论】：

在您的架构中查看editArticle 参数的类型。很可能它应该类似于MetaInput。它必须是 input 类型，而不是输出类型。

非常感谢，我想我现在明白了。所以 MetaInput 类型是我在服务器上定义的，但在客户端我可以写它的类型为 MetaInput 并且不需要在客户端再次定义它，正如我现在所理解的那样？

是的，如果你使用express-graphql，当然服务器端是依赖于实现的（你不一定需要自己构造一个new GraphQLInputObjectType - 你可能只是解析一个模式定义什么的）。但是在定义查询的前端，您只需按名称引用它，您不必做任何额外的事情。

好吧，我想这是让我感到困惑的一点！太感谢了。如果您只是将其写为答案，我肯定会接受:)

【参考方案1】：

您需要在服务器端架构中定义输入对象类型，例如

input MetaInput 
  name: String
  author: String
  release: Date

并在editArticle 定义中使用它

extend type Mutation 
  editArticle(id: ID!, title: String, meta: MetaInput): Article

那么你也可以在mutation EditArticle的客户端定义中引用MetaInput类型。

【讨论】：

非常感谢，这很有帮助！