【问题标题】：How to be sure that the react-redux app is rendered based on the latest request?如何确保 react-redux 应用程序是根据最新请求呈现的？
【发布时间】：2019-08-21 04:56:20
【问题描述】：
我有一个 react-redux 应用程序：
- 在首次应用程序加载（初始化）时根据“限制”查询参数（默认为 20 条记录）从数据库加载 N 条记录
- 应用每 10 秒从数据库请求相同（或更新）的记录以实时更新数据
- 如果用户更改过滤器 - 应用根据过滤器从数据库请求新记录并重新呈现应用（+ 更改间隔以根据过滤器加载数据）
- 如果用户向下滚动，应用会自动加载更多记录。
问题在于，如果用户和实例试图过滤掉某些内容，并且在同一时间间隔加载更多数据，则 2 个请求可能会发生冲突并相互覆盖。如何在 react-redux 应用程序中确定请求序列。也许有一个关于如何正确排队请求的通用方法？
提前致谢！
【问题讨论】：
标签：
reactjs
redux
async-await
redux-thunk
【解决方案1】：
我不确定你所说的“冲突”是什么意思。我的理解是会发生以下情况：
- 假设两个请求都成功，那么每个请求都取到数据，redux 状态会更新两次，渲染更新状态的组件会渲染两次（两次渲染之间经过的时间可能很简而言之，这对用户来说可能不是很愉快）
如果您只希望这两个请求中的一个来刷新组件，那么可能的解决方案可能如下：
在从数据库中检索数据之前，每个请求都会通过创建“RETRIEVAL_START”操作开始。 'RETRIEVAL_START' 将设置一个 redux 状态变量 'retrievalInProgress'
在这种情况下，如果您希望仅从两个请求中的第一个获取结果，您可以在从组件调用操作创建者之前检查“retrievalInProgress”是否打开。如果是，请不要调用操作创建者（换句话说，在请求进行时不要请求数据）。 'retrievalInProgress' 将在数据检索成功或失败时被清除。
如果您只想从两个请求中的第二个获取结果，则将“retrievalInProgress”设为计数器，而不是布尔值。在reducer的'retrievalSuccess'动作中，如果这个计数器大于1，就意味着一个新的请求已经开始了。在这种情况下，不要更新状态，而是减少计数器。
我希望这是有道理的。在我测试它之前，我不能 100% 确定它是否有效，我不会这样做 :)，但这是我将采取的方法。