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

不包括代码还没有，我想知道是否有人已经遇到了一个问题，即你：React组件中的错误导致应用重新呈现，导致无限循环。为什么？

具有被包裹在connect，在我的情况下，组件apollo-client
有子组件也裹在connect是做一个派遣componentWillMount
抛出一个错误的子组件
获取一个无限循环

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

错误未记录，直到调用堆栈溢出才出现在控制台中。

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

我可以尝试repro，但这需要相当多的时间，只是想知道是否有人遇到类似的问题，可以提供某处寻找。

2017-09-26 Jazzy

没有使用阿波罗，不能说我认识到这个问题。但出于调试的目的，我可能会尝试在再次分派动作之前在'componentWillMount'内部进行一些检查，并查看是否可以打破循环，并希望错误不会以这种方式丢失。或者在'componentWillMount'中使用断点，以便您可以随时停止它。并使用像Redux Devtools这样的工具来查看已发送的操作，以及它们是否包含预期的有效负载等。https://github.com/zalmoxisus/redux-devtools-extension – jonahe

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

来源

2017-12-10 18:37:33

没有看到任何代码，我不能给你最佳答案。我上面所说的依然如此，但这可能只会解决你的问题的一部分。另外，为了参考，React实际上也记录了这一点。尝试使用componentDidMount进行交叉引用，在该页面上稍微查找一下。 https://reactjs.org/docs/react-component.html#componentwillmount –

克莱顿是对的; ComponentWillMount虽然曾经是一种方式和事实，但有些反模式。您可能要使用ComponentDidMount。

但是，既然你提到了投掷，那么React 16的componentDidCatch lifecycle hook值得一提。这使您可以捕获错误并处理它在反应：

错误边界作出反应的是赶上JavaScript错误在他们的孩子组件树随地组件，记录这些错误，并显示一个备用的UI

从理论上讲，这应该可以让你处理错误和短路connect。

来源

2018-02-21 02:03:15 zedd45

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

回答

相关问题