title: Pass two children as props to a React component
body: <p>I have a component like this</p>
  <pre><code>    const Component = () =&gt; {
       return (
      &lt;div&gt;
         &lt;div className=&quot;data1&quot;&gt;
           {children}
         &lt;/div&gt;
         &lt;div className=&quot;data1&quot;&gt;
           {children2}
         &lt;/div&gt;
      &lt;/div&gt;
  )
      }
  </code></pre>
  <p>I would like to have Item1 and Item2 inside the &quot;data1&quot; div, and some other components inside the &quot;data2&quot; div. Writing the next code I only have Item1 and Item2 as children but I don't know how to pass the second children (for example Item3 and Item4)</p>
  <pre><code>&lt;Component&gt;
    &lt;Item1/&gt;
    &lt;Item2/&gt;
  &lt;/Component&gt;
  </code></pre>
  <p>I have to reuse the Component multiple times into the app so a function called children2 that returns the elements is not a good idea because they are different depending on where I use the component.</p>