React组件中的错误导致应用程序重新呈现，这导致无限循环。为什么？

Question

如果还没有包含代码，我想知道是否有人遇到过你的问题：

• 有一个包含在connect中的组件，在我的情况下包含apollo-client
• 让connect中的子组件也包含在componentWillMount
中进行调度
• 在子组件中抛出错误
• 获得无限循环

我所处的情况是，任何抛出错误的孩子都会导致父组件再次运行render并且所有孩子似乎都在运行componentWillMount，但不会运行componentWillUnmount。

错误未记录，并且在调用堆栈溢出之前不会出现在控制台中。

这导致他们全部重新连接到Redux，调度操作以及再次抛出错误，因为它们再次安装，这会导致循环。

我可以尝试重新制作，但这需要花费相当多的时间，只是想知道是否有人遇到了类似的问题，可以提供某个地方。

Answer 1

您不应该在componentWillMount中调度任何操作。任何被认为是可变的都应该在componentDidMount中完成。 componentWillMount类似于构造函数。组件未安装。组件不知道任何状态（除非您指定），但在组件实际安装之前不会满足该状态，这在componentDidMount中发生。理想情况下，您应该坚持使用构造函数而不是真正使用componentWillMount。对于任何API调用或调度，您应该将它们保留在cDM

中

Answer 2

克莱顿是对的;尽管曾经是道路和事实，ComponentWillMount有点像反模式。您可能想要使用ComponentDidMount。

但是，既然你提到了投掷，那么React 16的componentDidCatch lifecycle hook就没有价值了。这允许您捕获错误并在响应中处理它：

  

错误边界是在其子组件树中的任何位置捕获JavaScript错误的React组件，记录这些错误并显示回退UI

理论上，这应该允许您处理错误并使connect短路。