title: what's difference between setState and mobx setState
body: <p>soon I checked state after call setState in some method before re-render, I see state value hasn't changed because of rendered not followed yet. I'm following this concept so far..</p>
  <p>However, when it comes to <code>Mobx</code> <code>action</code> methods in class based components, I see state has been changed before re-render.</p>
  <p>Is there something difference in rendering when using mobx?</p>
  <pre class="lang-js prettyprint-override"><code>
    // functional component 
  ... 
   const [state, setState] = useState(false); 
   
   const init = () =&gt; {
     if(..some condition logic){
    console.log('check state before setState()', state) // false
    setState(true);
    console.log('check state after setState()', state) // false
    } 
   } 
   useEffect(() =&gt; {
      init(); 
    },[])  
  
   
  </code></pre>
  <p><strong>using mobx</strong></p>
  <pre class="lang-js prettyprint-override"><code> //class based component 
   ... 
   @observable flag = false;
   
   @action 
   setFlag( bool ) {
     this.flag = bool;  
   }
   init(){
     if(... some condition logic) {
       console.log (this.flag) // false 
       setFlag(true); 
       console.log(this.flag) // true 
     } 
   } 
   componentDidMount() {
    init(); 
   } 
  
  </code></pre>