如何在首次渲染之前在Redux中获取数据并将其设置为默认状态

Question

我有下拉过滤器，以按日期显示项目，例如，显示过去24小时的数据，显示过去3天的数据。

我的reducer中有defaultState

const defaultState = {
  dataArray: [],
  a: true,
  b: false
}

默认情况下， dataArray为空。 而且我有减速器和动作。 在componentDidMount方法中，我通过调度一些操作从服务器获取数据。 如果刷新页面，则列出最后24小时的项目的默认页面为空，因为dataArry来自我的reducer中的defaultState。 但是，如果我更改页面以列出最近三天的数据，则componentWillReceiveProps可以正常工作，并且在此方法中，我可以获取数据，它会减少状态并返回带有

dataArray = [{some data}]

如何获取数据并将其设置为刷新页面后呈现的状态？

Answer 1

向defaultState添加一个“加载”变量，并将其初始化为true。 数据获取完成后，将其设置为false。

在您的组件中检查此变量。 如果为true，则显示微调框和/或加载消息，否则显示数据。

除此之外，每次您开始提取之前，都要在提取之前触发一个名为“ FETCH_START”的操作，该操作会将加载变量设置为true。

如果获取时出错，则可以将另一个状态变量设置为错误消息。 该变量将被初始化（每次您开始获取）为空字符串。 如果加载完成，则可以检查此错误变量，如果有错误，则显示错误消息，而不是显示数据。

此过程对于各种情况（例如身份验证等）很有用。

Answer 2

Yossi的答案很明确。 我只是想更进一步，并提到您还可以通过了解何时获取数据来增强用户的体验。 例如，如果您在登录页面上并且知道大多数用户将要浏览您的商店，则在什么都没有发生的情况下开始在登录页面上获取该数据。

为此，请看一下： Google Dev的requestIdleCallback（）