4

我需要有React+Flux+async API requests模式经验的人的意见。在以下情况下缓存 api 响应的更好方法是什么：

  • 我有 3 个文章列表页面，每个页面都有相应的 API 端点来获取数据。

  • 每篇文章都有详细信息页面 UI，但没有 articleById 端点，所以我只.find需要在获取的数组中按 id 进行文章

  • 我只想在列表中发出1 个请求并将其缓存，因此当我从列表转到详细信息页面或返回列表时，将没有 API 请求。

  • 当我切换到另一个列表时，我应该发出请求并缓存它。

我想知道我是否应该在发出实际请求的 WebAPIUtils 服务中缓存响应？

还是更好地破解容器组件（所有 3 个列表都相同）以了解它是否应该触发启动 API 请求的操作？

谢谢！

4

1 回答 1

3

使用商店

您应该拥有 ListStore 来缓存处理以下操作的列表： LIST_CACHE ：此操作将列表推送到列表缓存。

在您的 List 组件中，当它从 ListStore 接收到更新时，尝试找到它应该显示的 List 并将其设置为它的状态。

如果列表不存在，请等待 ListStore 发出更改事件，然后在ListStoreChanged处理程序中，尝试再次查找列表。

现在您需要决定何时向列表缓存发出 API 请求。一种可能的选择是在您的应用加载时对所有列表发出 API 请求，然后将所有接收到的列表分派到 LIST_CACHE 操作。

如果您还没有，请阅读： http: //facebook.github.io/flux/docs/overview.html

于 2015-03-03T12:52:28.707 回答