GraphQl 操作中的参数？答案

【问题标题】：arguments in GraphQl operations?GraphQl 操作中的参数？
【发布时间】：2021-11-02 16:09:27
【问题描述】：

我无法理解通过客户端查询传递的参数与架构和解析器中服务器端操作中的参数之间的关系

在Apollo docks，他们正在创建太空旅行预订应用程序，该应用程序向客户显示启动信息，该应用程序默认显示 20 个结果，当单击查看更多按钮时，它会显示另一个 20 个等等！！

现在，客户端的查询如下所示：

launches.tsx

  query GetLaunchList($after: String) {
    launches(after: $after) {
      cursor  
      hasMore
      launches {
        ...LaunchTile  // a fragment
      }
    }
  }

在架构中，Query 字段 launches 看起来像这样

type Query {
  launches( 
    pageSize: Int
    after: String
  ): LaunchConnection!

 type LaunchConnection {
    cursor: String!
    hasMore: Boolean!
    launches: [Launch]!
  }

resolvers.js：

Query: {
    launches: async (_, { pageSize = 20, after }, { dataSources }) => {
      const allLaunches = // fetching data from a data source

      const launches = paginateResults({
        after,
        pageSize,
        results: allLaunches,
      });

      return {
        launches,
        cursor: launches.length ? launches[launches.length - 1].cursor : null,
        hasMore: // some logic to check if there are more results
      };
    }
 }

现在，我无法理解客户端查询中的 after 参数如何与架构和解析器相关，我知道客户端需要将此变量发送到服务器以供架构和解析器，因为服务器需要知道应该向客户端发送哪些数据，因为结果是分页的！！

graphql 如何在架构和解析器的启动中将 after 参数与 after 参数联系起来？？

【问题讨论】：

graphql.org/learn/execution
@xadm 我了解查询是如何执行的，但我不明白 pageSize 参数是如何在参数之后出现的，graphql 服务器如何知道客户端发送的是哪一个？？
传递的参数在第二个解析器参数中...console.log(args)，稍后分解（const { pageSize = 20, after } = args;）
@xadm 这就是我要说的，如果我将after 参数的名称更改为cursor 之类的名称，例如，服务器将如何识别它，在那部分！！
它使用默认值进行解构 - 如果未提供...您可以传递两个参数，它们将被使用，都通过...您可以使用此查询而不变量传递，将使用 null for after

标签： graphql apollo-client react-apollo apollo-server

【解决方案1】：

只有一件事可能是“神秘的”，而不是显而易见的——内联解构......

来自general graphql server docs - 解析器函数需要 4 个参数 (obj, args, context, info)，其中

args - 提供给 GraphQL 查询中的字段的参数。

你的解析器

`launches: async (_, { pageSize = 20, after }, { dataSources }) => {`

使用 ES6 解构赋值语法，一个“缩短版”：

launches: async (_, args, context) => {
  const { pageSize = 20, after } = args;
  const { dataSources } = context;`

从架构 launches 可以有 2 个参数（pageSize 和 after），它们作为 args 对象道具传递给解析器。

两个参数都是可选的（可以为空 - 也来自模式），但处理方式略有不同 - 请参阅带有默认/后备的解构声明：

  const { pageSize = 20, after } = args;

对于两个 args 缺失（客户端未提供）pageSize 将使用默认值 20 而after 将是 null-ed。

对于传递的两个参数 - 将使用两个值（而不是默认值）。

这是here 描述的标准 JS ES6 行为。

【讨论】：