Question

使用apollo-client和graphql-tag我正在尝试创建类似以下内容的请求：

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

然而，并非所有这些选项都始终设置，有时我可能只使用限制和偏移。但是，如果我不让他们离开，我会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（{query：MY_QUERY，variables：{limit：10，offset：20}}）

如果任何变量未定义，则无需再执行任何操作即可忽略它们。

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

1 个答案: