使用 Apollo 替换 Redux 进行本地状态管理

Qui*_*nDa 5 apollo reactjs graphql redux

我对 GraphQL 和 Apollo 还很陌生,但过去 3 年我一直在使用 Redux 和 React。基于 Apollo 文档,他们鼓励开发人员将其用作单一事实来源:

我们希望能够从应用程序中的多个组件访问布尔标志和设备 API 结果,但不想维护单独的 Redux 或 MobX 存储。理想情况下,我们希望 Apollo 缓存成为客户端应用程序中所有数据的单一事实来源

我正在尝试找出使用 Apollo 复制 Redux 所允许的方法。在我的应用程序中,我有“标签”,这是一个对象数组,每个对象都有近 15 个不同的字段。它们用于我的应用程序的 3 个不同部分,每个部分显示特定的“标签”以及“标签”中的特定字段。基于此,我使用 Redux 处理此问题的方法是从 API 中获取“标签”,并且在化简器中,我创建不同的数组,其中包含每个部分所需的特定“标签”的 ID,并且我还创建了带有原始数据的 Map (id, value)。它会是这样的:

const tags = new Map(); //(tagId, tag) containing all the tags
const sectionATags = []; // array of ids for section A tags
const sectionBTags = []; // array of ids for section B tags
const sectionCTags = []; // array of ids for section C tags
Run Code Online (Sandbox Code Playgroud)

我的目标是复制相同的行为,但是,尽管他们鼓励您使用 Apollo 管理您的本地状态,但我不确定我想要实现的目标是否可以通过简单的方式实现,或者这实际上是否是一个好的实践与阿波罗一起这样做。我一直在关注文档中的这个示例@client,他们主要做的是通过扩展查询或使用指令改变缓存数据来向从服务器接收的数据添加或删除额外的字段。

同时,我知道 GraphQL 的目的是查询您需要的特定数据,而不是典型的 REST 请求,在典型的 REST 请求中,无论您是否需要,您都会获得包含所有数据的大 JSON,但感觉它不会在这种情况下,使用每个部分所需的特定数据执行 3 个不同的查询效率不高。

我不确定我是否遗漏了一些东西,或者阿波罗可能被认为是“更简单的本地状态管理”。我是否遵循正确的道路,还是应该继续将 Redux 与另一个 GraphQL 库一起使用,该库只允许我在没有管理层的情况下获取数据?

xad*_*adm 0

Apollo 具有规范化缓存...您可以查询一次所有[任何地方所需的字段]数据 - 后续/附加查询可以“仅缓存”。不会提出额外的请求 - 如果所有必填字段都已存在,则安全。

转换数据结构......通常不需要,我们正在处理我们需要的数据[和形状](“不是我们的问题,而是后端问题”)。你可以:

  • 更改解析器中的数据形状[在包装 REST 的 graphql API 中],
  • 重塑 REST-link 中的数据(从 Apollo 直接访问 REST API),
  • 启动时读取一次数据,转换后保存在本地(以下所有查询均读取本地)

常见的应用程序状态可以保留在 redux 中 - 数据获取应该在 apollo 中。