使用带有异步数据加载的 redux 的正确方法答案

【问题标题】：Correct way to use redux with async data loading使用带有异步数据加载的 redux 的正确方法
【发布时间】：2019-04-10 21:26:28
【问题描述】：

我正在使用redux 在react 应用程序中从后端加载数据。我正在使用 axios 加载一堆数据，然后我可以选择一个项目并在不同的视图中查看具体信息。每次在后端进行搜索时，我都会呈现“正在加载”视图。问题是：每当我加载刷新浏览器的视图时，这个搜索就很好。但是当我在自己的应用程序中导航时，我使用react-router-dom 并且不需要显示加载屏幕，因为它已经在 redux 商店中。

如果我已经有数据，有没有办法告诉 redux 或做出反应不要进行异步调用？

redux-persist 可以解决这个问题吗？我应该在反应条件下手动执行吗？

我在componentDidMount 方法中拨打电话

【问题讨论】：

请发布您拥有componentDidMount() 生命周期方法的组件的代码，并确保您也包含import 语句。另外，当您说加载视图时，您指的是微调器还是只是一些显示Loading... 的文本？请也发布该代码。您是从componentDidMount() 呼叫动作创建者吗？再次发布所有相关代码。
@Daniel 我在问一个理论问题，我不明白这与这个问题有什么关系。这就是我没有放任何代码的原因。

标签： reactjs redux async-await

【解决方案1】：

您应该将来自 redux 存储的数据作为属性传递给您的组件，并且您应该在 componentDidMount 或之前检查数据是否为空或 null 或其他什么，然后决定是否应该在此之后加载它.您不需要任何 3rd 方库来进行数据持久化（例如 redux-persist），因为您实际上已经将它保存在您的 redux 存储中。

【讨论】：