Why Does This Error Exist: "invariant Violation: Cannot Update During An Existing State Transition"

I seem to be running into this error in a large application (but I'm not exactly sure where): Uncaught Error: Invariant Violation: setState(...): Cannot update during an existin

Solution 1:

The issue is that setState will cause a re-render (potentially, depending on shouldComponentUpdate). If you had a setState call within the render function, it would trigger yet another render. You'd likely end up in an infinite loop of re-renderings. There's nothing that stops you from using setState as a result of some asynchronous operation (in fact it's very common). It's fine just as long as it's not in the render or some other lifecycle method of a component that is run on a state update (shouldComponentUpdate being another as you'd end up with an infinite loop in the same way).

Solution 2:

One way to achieve this is to use the Flux pattern and have your timeouts trigger changes in a store. This will cause the changes to propagate to interested components as part of their lifecycle.