title: variable in useState not updating in useEffect callback
body: <p>I'm having an issue while using useState and useEffect hooks</p>
  
  <pre><code>import { useState, useEffect } from "react";
  
  const counter = ({ count, speed }) =&gt; {
      const [inc, setInc] = useState(0);
  
      useEffect(() =&gt; {
  
          const counterInterval = setInterval(() =&gt; {
              if(inc &lt; count){
                  setInc(inc + 1);
              }else{
                  clearInterval(counterInterval);
              }
          }, speed);
  
      }, [count]);
  
      return inc;
  }
  
  export default counter;
  </code></pre>
  
  <p>Above code is a counter component, it takes count in props, then initializes inc with 0 and increments it till it becomes equal to count</p>
  
  <p>The issue is I'm not getting the updated value of inc in useEffect's and setInterval's callback every time I'm getting 0, so it renders inc as 1 and setInterval never get clear. I think inc must be in closure of use useEffect's and setInterval's callback so I must get the update inc there, So maybe it's a bug?</p>
  
  <p>I can't pass inc in dependency ( which is suggested in other similar questions ) because in my case, I've setInterval in useEffect so passing inc in dependency array is causing an infinite loop</p>
  
  <p>I have a working solution using a stateful component, but I want to achieve this using functional component</p>