在Redux应用程序中，在页面转换时拒绝前一个路由的挂起操作

Question

我有反应路由器的Redux应用程序(基于https://github.com/este/este)。

在一个路由中，可能有超过1个AJAX调用(由redux-promise-middleware &redux-thunk触发)。当页面发生变化(通过react-router)时，我希望拒绝由上一路由触发的所有剩余的_SUCESS或_FAILED回调actions。

做这件事最好的方法是什么？

Answer 1

我建议您让获取的数据具有分页意识。这意味着在启动抓取的操作中，添加一个page-context。当reducer获得数据时，它可以为该页面上下文保存数据，也可以在位置与您的浏览器不同时将其丢弃(这意味着用户已导航离开)。如果您为不同的页面/上下文保存数据，那么还可以在用户返回时准备好这些数据(如果这是您想要的东西)。

1. 您在url "/pageX“上。您开始获取数据，该操作确保在分派成功操作时记住页面上下文。当reducer处理操作时，它将数据存储在store.context["/pageX"].data (或类似文件)中。注意:如果当前位置与接收到的数据不同，您也可以将其丢弃(reject)。
2. UI应该知道如何从上下文中询问/使用仅与其位置匹配的数据。

您可能还想考虑跟踪应用程序状态中的浏览器位置...