title: How to change a react state immediately by setTimeout after setState?
body: <p>new in react here, don't know if it's right to do this on the setState callback like this?</p>
  
  <pre><code>           setTimeout(()=&gt; {
              this.setState((state, props) =&gt; ({ activateLightColorForRed: true }), () =&gt; {
                setTimeout(()=&gt; {
                  this.setState(()=&gt; ({ activateLightColorForRed: false }))
                }, 500);
                red.play();
              })
            }, toWait); 
  </code></pre>
  
  <p>or maybe something like this?</p>
  
  <pre><code> this.setState((state, props) =&gt; {
      this.setState((state, props) =&gt; {
        activateLightColorForRed: true
      });
      setTimeout(() =&gt; { activateLightColorForRed: false },500)
    })
  </code></pre>
  
  <p>are the state on the setState callback updated? something weird is happening in my components, it's rendering multiple times. I am not sure but I think it's because I'm doing the first sample?</p>