title: React hook's state using scroll events issue
body: <p>This is a first time, when I use react hooks. 
  I try to disable fetching, using a state (boolean).
  But there is a problem, because a function still see's initial state and execute function dozen times instead once. 
  I can't see the point. In the react console the state is marked as true, and still pass my if statement</p>
  
  <p>I noticed fact, that without listener on window it is working. 
  So I tried to use event build in React - onScroll, but thats not resolve my issue - nothing happened. 
  My version of React: 16.8.6</p>
  
  <pre><code>const [isFetchedData, setIsFetchedData] = useState(false);
   const fetchBookData = async () =&gt; {
      await setisFetchedData(true);
      ... - fetchedData
      setTimeout(() =&gt; {
        setIsFetchedData(false);
      }, 5000); --- I would like to make available to fetch data again after 5 seconds.
    };
  
    useEffect(() =&gt; {
      window.addEventListener("scroll", scrollHandler);
    });
  
    const scrollHandler = () =&gt; {
      if (!isFetchedData) {
        fetchBookData(); --- always executing
      }
    };
  </code></pre>
  
  <p>Fleischpflanzerl - I put that function in body of useEffect. The function scrollHandler in not executing now. Can you give me some of example how to fix that?</p>
  
  <pre><code>useEffect(() =&gt; {
      return () =&gt; {
        window.addEventListener("scroll", scrollHandler, true);
        const scrollHandler = () =&gt; {
          if (!isFetchedData) {
            // fetchBookData();
            console.log("fetch");
          }
        };
      };
    }, [isFetchedData]);
  </code></pre>