title: Function in useEffect runs once whereas I want to run concurrently
body: <p>I have an array with <code>length === 4</code> <strong>Please note that the length may vary based on some outside parameters</strong>. I want to run a function that generates input fields according to the length of my array onComponentDidMount using useEffect.</p>
  
  <pre class="lang-js prettyprint-override"><code>const [blankField, setBlankField] = useState([dynamicFields]); // This adds the input fields with the required data
  
  const legs = [{...}, {...}, {...}, {...}]; // the length of legs[] may vary in number
  
  const addField = () =&gt; {
          setBlankField([...blankField, [...dynamicFields]]);
      };
  
      useEffect(() =&gt; {
          if (legs) {
              legs.map(leg =&gt; {
                  console.log(leg);
                  return addField();
              });
          }
      }, []);
  
  blankFields.map(......);
  </code></pre>
  
  <p>I want it to generate as many fields as the length of the array immediately the component mounts.</p>