如何调试ReactJS的setState

Question

我目前正在处理中型的reactJS应用程序，并在单击组件上的按钮后收到以下错误消息：

Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op.

如何更轻松地调试？为什么没有reactJS给我一个违反此规则的特定组件名称？

你会怎么做？

Answer 1

当提供的消息与特定模式匹配时，您可以覆盖console.warn使其抛出而不是日志。在您的情况下，您可以：

var warn = console.warn;
console.warn = function(warning) {
  if (/(setState)/.test(warning)) {
    throw new Error(warning);
  }
  warn.apply(console, arguments);
};

错误的堆栈跟踪将指向导致警告的行。

Answer 2

实际上，解决此问题的最佳方法是在本地更改一些反应代码。

This pull-request明确指出如何修改src/renderers/shared/reconciler/ReactUpdateQueue.js以获取非法设置状态的组件。

由于这个拉动请求已经合并到了回购中，因此在将它集成到npm版本的反应之前不应该很久，人们可能会希望。