未捕获的不变违规：超出最大更新深度答案

【问题标题】：Uncaught Invariant Violation: Maximum update depth exceeded未捕获的不变违规：超出最大更新深度
【发布时间】：2019-10-17 05:55:47
【问题描述】：

我正在尝试在函数完成后设置状态，但出现错误：

Uncaught Invariant Violation: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.

我在函数完成后在回调中调用 setstate，所以我认为从我读过的内容来看这可以正常工作，但我似乎无法让它工作。

组件更新时运行addStuff函数

componentDidUpdate() {
   this.addStuff(() => this.setState({"loading":false}))
}

完成时设置回调

addStuff(callback) {
    ...Does a bunch of stuff
    callback();
}

谁能建议我在这里做错了什么？谢谢。

【问题讨论】：

不，在应用状态下默认是真的
Uncaught Invariant Violation : Maximum update depth exceeded的可能重复

标签： javascript reactjs

【解决方案1】：

无限循环的原因是您没有将setState 包装在条件中，而是在回调中。

所以我认为一旦你的组件更新，setState 就会被调用，这会触发重新渲染，这意味着componentDidUpdate 会被调用，它会设置状态，从而触发重新渲染，调用 componentDidUpdate 等。

这就是为什么componentDidUpdate 中的设置状态应该始终是有条件的，正如the example in the docs 中所指定的那样。在您的情况下，它可能看起来像这样，您可以在其中比较相关道具以验证您确实需要重新渲染：

componentDidUpdate(prevProps) {
  if (this.props.relevantProp!== prevProps.relevantProp) {
    this.addStuff(() => this.setState({"loading":false}))
  }
}

【讨论】：

【解决方案2】：

如果您阅读React Docs，它会清除状态“您可以立即在 componentDidUpdate() 中调用 setState()，但请注意它必须包含在上面示例中的条件中，否则您将导致无限循环。”因此，对于您的功能，它正在发生同样的事情。

【讨论】：