title: React hook is not working from event handler
body: <p>React version: 16.8.2</p>
  
  <pre><code>const { useState } = React;
  
  const Dropdown = ({
    options,
    onClick,
    selected,
  }) =&gt; {
    const [showDropDown, setShowDropDown] = useState(false);
  
    function toggleDropDown() {
      setShowDropDown(v =&gt; !v);
    }
  
    function createOption(o) {
      return (
        &lt;div
          key={o}
          className='drop-down__option'
          onClick={() =&gt; {
            onClick(o);
            toggleDropDown();  
            // The following isn't working either
            // setShowDropDown(false);
          }}
         &gt;
          {o}
        &lt;/div&gt;
      );
    }
  
    return (
      &lt;div
        onClick={toggleDropDown}
        className='drop-down'
      &gt;
        &lt;div&gt;{selected}&lt;/div&gt;
          {showDropDown &amp;&amp; (
            &lt;div className='drop-down__list'&gt;
              {options.map(createOption)}
            &lt;/div&gt;
          )}
      &lt;/div&gt;
    );
  };
  
  const App = () =&gt; {
    const [selected, setSelected] = useState(0);
  
    return (
      &lt;Dropdown
        selected={selected}
        options={[0,1,2,3]}
        onClick={v=&gt;{setSelected(v)}}
      /&gt;
    );
  }
  
  ReactDOM.render(
    &lt;App /&gt;,
    document.getElementById('root'),
  );
  </code></pre>
  
  <p>So, it's a simple <code>Dropdown</code>, when you click the container, it toggles the <code>Dropdown</code>.</p>
  
  <blockquote>
    <p>But the problem here is, after clicking one of the options, the option has been updated, but the <code>Dropdown</code> is not been closed.</p>
  </blockquote>
  
  <p>So it appears <code>toggleDropDown();</code> in the following code has no effect.</p>
  
  <pre class="lang-js prettyprint-override"><code>        onClick={() =&gt; {
            onClick(o);
            toggleDropDown();  
            // The following isn't working either
            // setShowDropDown(false);
          }}
  </code></pre>
  
  <p>A reproduce example can be found here: <a href="https://codepen.io/vensa-albertgao/pen/ommGZe" rel="nofollow noreferrer">https://codepen.io/vensa-albertgao/pen/ommGZe</a></p>
  
  <p>What did I miss?</p>