从redux-store加载数据的最佳位置是哪里？

Question

我在父React组件中使用componentDidMount()方法从API中获取一些数据，然后将其保存在redux-state中。

在我的渲染方法中，我有另一个组件，它应该使用全局redux-state中的数据。

我可以通过props向我的子组件发送数据，也可以使用mapStateToProps()加载它们。

如果我试图在我的子组件构造函数或componentDidMount()方法中从属性中console.log或将数据赋值给var，我就得不到预期的数据(我得到的是初始状态)。

我的render方法中的Console.log将在第一次呈现时显示初始状态，在第二次呈现时显示正确的数据。

我需要确定我有正确数据的地方。

将正确分配...where var a= this.props.somethingFromState；。

是渲染方法的最佳位置，以及通常情况下执行此操作的最佳实践。谢谢。

Answer 1

这里有几个问题。

就加载数据的位置而言，根据facebook docs的建议，componentDidMount确实是调用ajax方法和加载数据的正确位置。

至于是否随后通过道具将数据传递给子组件，我喜欢在presentational vs container components上遵循Dan Abramov(redux的作者)的guid。简而言之，尝试有一个容器组件来加载数据并执行所有逻辑，然后通过props向下传递任何需要的表示组件，如果可能的话，使它们成为纯函数。

关于何时拥有正确的数据，请查看上面的React生命周期文档。您将看到，依次触发constructor、componentWillMount、render和componentDidMount。因此，如果您的ajax调用获取componentDidMount中的数据，那么您将首先调用render，从而不会在已经安装的组件上加载任何数据。大多数人通过放置一个微调器来解决这个问题，直到数据从ajax加载完毕。一个简单的if语句就可以做到这一点。