如何让 Redux Thunk 和 Apollo GraphQL 协同工作

Posted 2023-02-22

【中文标题】如何让 Redux Thunk 和 Apollo GraphQL 协同工作

【英文标题】：How to make Redux Thunk and Apollo GraphQL work together

【发布时间】：2017-08-19 15:58:35

【问题描述】：

在我的项目中，Redux Thunk 用于将所有异步函数保存在动作创建器中。

现在我正在尝试将 Apollo GraphQL 添加到我的项目中，一切正常，除了将 mutations 添加到我的功能组件并在那里调用它们时，它会破坏 redux thunk 架构。

如何解决？我想我可以创建新的动作创建器方法并将突变传递给它们，但它很快就会变成样板，这对我来说似乎不是一个好的解决方案。

【参考方案1】：

Apollo 突变不会破坏 redux thunk 架构。如果您需要在突变后更新自己的减速器，则从突变的then 或catch 中分派这些减速器的操作。 Apollo 的 graphql 容器旨在替换异步 redux 中间件（thunk、sagas、epics），而不是破坏它。

对于 Apollo Client 1.0

如果需要，您还可以将自己的 reducer 连接到 Apollo 调度的相同操作（APOLLO_MUTATION_INIT、APOLLO_MUTATION_RESULT 等）。只需确保您将 apollo 商店与您自己的商店集成在一起即可。见http://dev.apollodata.com/react/redux.html。

更新：迁移到 Apollo Client 2.0

Apollo Client 2.0 移除了使用 redux 作为其缓存（存储）的依赖。如果您仍然希望能够在减速器中使用 1.0 样式的操作，可以使用此链接 https://www.npmjs.com/package/apollo-link-redux（自述文件中的示例用法）。