Apollo 客户端中的抽象中继式连接答案

【问题标题】：Abstract relay-style connections in Apollo clientApollo 客户端中的抽象中继式连接
【发布时间】：2019-12-25 01:27:43
【问题描述】：

我正在构建一个应用程序，它将在后端使用 GraphQL，在前端使用 Apollo-client。我将使用Relay-style connection types，因为它允许我们将元数据放在关系上。

但是，我们不希望我们的 React 组件必须处理连接增加的额外复杂性。出于遗留原因，也因为它看起来更干净，我希望我的反应组件不必处理 nodes 和 edges。我更喜欢绕过：

片段 1：

const ticket = {
  title: 'My bug'
  authors: [{ login: 'user1', login: 'user2' }]
}

而不是

片段 2：

const ticket = {
  title: 'My bug'
  authors: {
    nodes: [{
      login: 'user1',
      login: 'user2',
    }]
  }
}

同样在打字稿中，我真的不认为自己定义了包含节点和元数据的票证类型，例如nextPage、lastPage 等...

我正在尝试提出一个抽象，可能是在 apollo 客户端级别，它允许我自动将 Snippet 2 转换为 Snippet 1，同时在我实际需要这些元数据时仍然允许访问 Snippet 1。

这个问题已经被其他人解决了吗？您对可能的解决方案有什么建议吗？我是不是走错方向了？

【问题讨论】：

标签： graphql apollo apollo-client relay

【解决方案1】：

您可以简单地在架构中公开其他字段，而不是尝试解决此客户端问题。您可以通过official SWAPI example 看到这一点：

query {
  allFilms {

    # edges
    edges {
      node {
        ...FilmFields
      }
    }

    # nodes exposed directly
    films {
      ...FilmFields
    }
  }
}

通过这种方式，您可以根据需要查询有或没有连接的节点，而不必在客户端使事情复杂化。

【讨论】：