title: Select value doesnt change the first time I trigger onChange event when using setSate React
body: <p>I have a set of select menus and I am trying to change a value when I select an option using onChange={updateValue} event. When I first select an option, the value is not being updated in the select menu.
  It only changes the second time I try to choose an option. Not sure what I am doing wrong.</p>
  <p>Edit: I did some more research (<a href="https://stackoverflow.com/questions/28868071/onchange-event-using-react-js-for-drop-down">OnChange event using React JS for drop down</a>) and I believe I need the value of the select to be updated as well, using setState. I cant figure out how to do it without having a variable for each value and set the state again.</p>
  <pre><code>let selectMenus = [
    {
      id: 'id1',
      name: 'name1',
      label: 'label1',
      value: '0',
      options: [
        {
          text: 'All ages',
          value: '0',
        },
        {
          text: '35 - 37 yrs',
          value: '1',
        },
      ],
      buttonLabel: 'Refresh',
    },
    {
      id: 'id2',
      name: 'name2',
      label: 'label2',
      value: '1',
      options: [
        {
          text: 'All ages',
          value: '0',
        },
        {
          text: '45 - 50 yrs',
          value: '1',
        },
      ],
      buttonLabel: 'Refresh',
    },
  ];
  
  const [url, setUrl] = useState('http://localhost:5000/selectDropdowns1');
  
  const updateValue = () =&gt; {
    setUrl('http://localhost:5000/selectDropdowns2');
  };
  
  &lt;form&gt;
    {selectMenus.map((select) =&gt; (
      &lt;div key={select.id} className='select-container'&gt;
        &lt;label htmlFor={select.id}&gt;{select.label}&lt;/label&gt;
        &lt;select id={select.id} name={select.name} value={select.value} onChange={updateValue}&gt;
          {select.options.map((option) =&gt; (
            &lt;option value={option.value} key={uuid()}&gt;
              {option.text}
            &lt;/option&gt;
          ))}
        &lt;/select&gt;
        &lt;button&gt;{select.buttonLabel}&lt;/button&gt;
      &lt;/div&gt;
    ))}
  &lt;/form&gt;;
  </code></pre>