如何调试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

实际上，解决这个问题的最好方法是在本地更改一些react代码。

这个拉取请求特别指出了如何修改src/renderers/shared/reconciler/ReactUpdateQueue.js以获取非法设置状态的组件。

由于这个 pull-request 已经合并到 repo 中，所以不久之后它就会被集成到 React 的 npm 版本中，人们可以希望。