GraphQL 变异教程：掌握 GraphQL 中的变异操作-JavaScript中文网-JavaScript教程资源分享门户

GraphQL 是一个用于 API 的查询语言和运行时。它提供了一种更高效、强类型、可扩展的数据传输方式，让我们能够更好地控制数据的获取和更新。另外，GraphQL 中的变异操作还能帮助我们更好地管理数据的写入操作。

在本篇文章中，我们将深入探讨 GraphQL 中的变异操作，并给出一些示例代码供大家参考。

变异操作

GraphQL 中的变异操作由三个关键字组成：mutation、input 和 payload。

mutation

mutation 关键字用于定义一组能够改变服务端数据的函数。在 GraphQL 中，mutation 只能定义执行副作用的操作（比如创建、更新或删除数据），而不能定义查询操作。

通过使用 mutation 关键字定义变异操作，我们可以方便地把不同的数据变更操作组织在一起。

以下是一个示例 mutation：

mutation {
  createPost(input: {title: "Hello World", content: "This is my first post."}) {
    id
    title
    content
  }
}

这个 mutation 用于创建一篇新的博客文章，并返回它的 ID、标题和内容。

input

input 关键字用于定义变异操作的输入类型。它通常包含了一系列输入变量，这些变量被用于传递客户端提供的信息。

以下是一个示例 input：

input CreatePostInput {
  title: String!
  content: String!
}

这个 input 用于定义创建一篇博客文章所需要传递的两个参数：标题和内容。! 符号表示这两个参数是必须的。

payload

payload 关键字用于定义某个操作的返回类型。通过 payload，我们可以指定返回哪些信息。这个模式可以确保我们在运行 mutation 操作后，始终能获得服务器返回的内容，即使发生了一些不可预见的错误。

以下是一个示例 payload：

type CreatePostPayload {
  id: ID!
  title: String!
  content: String!
}

这个 payload 用于定义创建博客文章操作返回的三个属性：ID、标题和内容。

示例代码

接下来，我们来看几个完整的例子。

添加新用户

mutation AddUserMutation($input: AddUserInput!) {
  addUser(input: $input) {
    id
    name
  }
}

input AddUserInput {
  name: String!
}

type AddUserPayload {
  id: ID!
  name: String!
}

在这个例子中，我们定义了一个 mutation 操作，用于添加新的用户。我们通过 AddUserInput 来指定客户端需要传递的参数，比如用户的名称。在 AddUserPayload 中，我们指定了客户端期望得到的返回值，也就是新创建用户的 ID 和名称。

修改用户信息

mutation UpdateUserMutation($input: UpdateUserInput!) {
  updateUser(input: $input) {
    id
    name
  }
}

input UpdateUserInput {
  id: ID!
  name: String
}

type UpdateUserPayload {
  id: ID!
  name: String!
}

在这个例子中，我们定义了一个 mutation 操作，用于修改已经存在用户的信息。在客户端提交请求时，我们通过 UpdateUserInput 来指定需要修改的用户 ID 以及修改后的名称。在 UpdateUserPayload 中，我们指定了客户端期望得到的返回值，也就是修改后的新 ID 和名称。

删除用户

mutation RemoveUserMutation($input: RemoveUserInput!) {
  removeUser(input: $input) {
    id
  }
}

input RemoveUserInput {
  id: ID!
}

type RemoveUserPayload {
  id: ID!
}

在这个例子中，我们定义了一个 mutation 操作，用于删除已经存在的用户。在客户端提交请求时，我们通过 RemoveUserInput 来指定需要删除的用户 ID。在 RemoveUserPayload 中，我们指定了客户端期望得到的返回值，也就是已经被删除的用户 ID。

结论

在本文中，我们已经深入介绍了 GraphQL 中的变异操作，并给出了一些示例代码用于帮助大家更好地理解。

学会了 GraphQL 中的变异操作，我们能够更好地管理数据的写入操作，为我们的应用程序提供强大的数据操作能力。另外，通过使用 GraphQL 中的 mutation、input 和 payload 等关键字，我们能够更好地组织和管理我们的数据变更操作。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/6774e83f6d66e0f9aaf19796