GraphQL：使用多个可选参数创建请求

Question

使用 apollo-client 和 graphql-tag 我正在尝试创建类似这样的请求：

gql`
    {
        data(
            filter: ${options.filter}
            sort: ${options.sort}
            limit: ${options.limit}
            offset: ${options.offset}
        ) {
            name
        }
    }
`

然而，并非所有这些选项都已设置，有时我可能只使用 limit 和 offset。但是如果我不设置它们，我会得到 Expected type Int, found undefined.

我是否应该事先遍历我的选项对象并将任何 undefined 值与 null 交换？或者有更好的方法来构建它吗？

Answer 1

您应该避免在查询中对值使用占位符，而是使用变量。所以您的查询现在看起来像这样：

const MY_QUERY = gql`
  query MyQuery($filter: String, $sort: String, $limit: Int, $offset: Int) {
    data (
      filter: $filter
      sort: $sort
      limit: $limit
      offset: $offset
    ) {
      name
    }
  }
`

注意：您为变量定义的类型需要与您的过滤器、排序、限制和偏移参数的架构相匹配。

现在您可以在渲染 Query 组件时传入变量：

<Query query={MY_QUERY} variables={{ limit: 10, offset: 20 }}>
  {({ loading, error, data }) => {
    // ...
  }}
</Query>

或者，使用 HOC：

graphql(MY_QUERY, { options: (props) => ({ variables: { limit: 10, offset: 20 } }) }

或直接使用客户端：

client.query({ 查询: MY_QUERY, 变量: { limit: 10, offset: 20 } })

如果有任何变量未定义，它们将被忽略，您无需再做任何事情。

GraphQL：使用多个可选参数创建请求

GrahpQL: Create requests with multiple optional arguments

apollo

graphql

graphql-js

apollo-client