How to debug ReactJS setState

I am currently working on a medium actionJS application and am getting the following error after clicking a button on a component:

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.

      

How can I debug this more easily? Why doesn't he respond? Give me the specific name of the component where this rule was violated?

How do you do it?

+3


source to share


2 answers


In fact, the best way to solve this problem is to change the local react code.

This pull request indicates how to modify src/renderers/shared/reconciler/ReactUpdateQueue.js

to get the component that is out of status.



Since this pull request has already been merged into the repo, it shouldn't be long before it's integrated into the npm react version, hopefully.

+3


source


You can override console.warn

to force it to throw instead of a log when the provided message matches a certain pattern. In your case, you would do:

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

      



The error stack trace will point to the line causing the warnings.

+10


source