在 React 中我们应该在哪里发出 API 请求？

Question

我一直在ComponentDidMount生命周期中发出API's请求，并在回调中调用setState 。 但是在深入挖掘的过程中，我偶然发现我们不应该在这个生命周期中调用 setState ，因为它会再次触发 render 方法，而 React 也不建议这样做。

那么在这种情况下，我们到底应该在哪里发出请求并调用setState来使用结果呢？

Answer 1

您绝对应该在componentDidMount进行 API 调用。 不推荐的是重新渲染一个大的组件，而是你应该做的是将你的 UI 分解成小的逻辑组件，只重新渲染需要的部分，而不是整体。 例如，你有一个很大的命名组件HomeComponent其中有3个个小的元件称为NavComponent ， BodyComponent和FooterComponent 。 你不应该调用从该API componentDidMount中的HomeComponent因为调用setState从HomeComponent将重新呈现内所有的小部件HomeComponent ，因为你知道，在导航栏或页脚是不是需要重新渲染这是没有必要的。 而不是来自BodyComponent ，因为只有身体部分需要重新渲染，因为它的状态已经改变。 所以你应该从BodyComponent的componentDidMount调用 API，这样你就只重新渲染需要的东西。

Answer 2

@Shababb Karim 是对的，但如果我要在我的项目中实现 API 调用，我会添加一个状态管理库。 Redux 是一种向应用程序实现全局状态的好方法，您可以在其中设置来自所述 API 的数据。 所有需要该数据的组件都可以附加到 Redux 状态以获取它。

不过，在较小的项目中，Redux 可能会带来一些开销。 在这种情况下，还有其他选项，如 Flux（虽然我更喜欢 Redux）。