title: How to delay firing a function in react using Hooks
body: <p>This is the first time I'm trying something like this. When I click the button, I want to set the new value and then fire the function, but only after a delay.  The reason for this, is that I want to stop the user from spamming the button and firing the function every time.  From my research, I think I need to put the function that needs to be timed out in a <code>useEffect</code> and listen for when <code>amount</code> changes?, not in the <code>onClick</code> like I have here.  But I'm running into some problems.  Any help would be greatly appreciated</p>
  <pre><code>        &lt;StyledQuantityButton disabled={ amount &lt;= 0 } 
              onClick={() =&gt; {
                  const newValue = amount - 1;
                  setAmount(newValue);
                  setTimeout(iWantToDelayThisFunction(someDataToBePassed, moreData), 2000)}
              } &gt;
              &amp;mdash;
          &lt;/StyledQuantityButton&gt;
  </code></pre>