0

我有一个 GraphQL (GQL) 服务器，并且在前端使用 TypeScript (TS)。这是我的 GQL 类型。

type AutomatedAlgorithmValue {
  politicalEntityAlgorithmValueId: Long
  politicalEntityId: Long!
  ...
}

politicalEntityId是不可为空的。如果我要求，这给了我行为politicalEntityId，那么它保证在那里，但如果我不要求它，那么查询将正常运行。

我使用graphql-codegenerator从 GQL 模式中创建 TS 类型。TS 类型使politicalEntityIdas 非空，所以现在在前端我必须始终请求politicalEntityIdas 类型的一部分，AutomatedAlgorithmValue即使它不是我想要请求的东西。

在我的前端代码中，我将数据保存在一个钩子中

let [results, setResults] = useState<AutomatedAlgorithmValue[]>([]);

这是我的 GQL 请求

executeAutomatedAlgorithmProcess(politicalEntityId: $id, type: $type) {
    values {
      politicalEntityAlgorithmValueId
    }
  }

此时我不需要politicalEntityId，但是当我尝试将数据添加到我results的 时，TS 编译器知道我正在null为non-null属性添加politicalEntityId 并引发错误。

non-null如果存在具有其他属性的对象，情况会变得更糟，因为现在请求会随着每个不必要的属性/对象non-null而变得越来越大。non-null

其他人是如何处理这个问题的？我每次都必须创建一个新类型吗？我是否使用Pick来确定数据将在results hook? 是否有一个插件可以使所有内容都可以为空，如果有，我应该使用它吗？

4

1 回答 1

0

因此，我认为您使用的是使用 graphql-code-generator 的typescript插件根据您的 GraphQL 模式生成的类型。正如您所说，这些类型在模式中指定了每个字段。

我相信您还需要做的是使用typescript-operations 插件。typescript 操作插件基本上可以完成您所说的 using Pick，但它会根据您定义的前端查询自动执行。因此 typescript 操作插件生成的类型与您声明的操作相匹配。

您还经常在这两个之上使用第三个插件，它是特定于您的客户端的，例如react-query、react-apollo、urql等，因此您最终可以为每个具有类型安全性的操作使用钩子.

于 2021-01-13T17:03:22.810 回答