title: React Router : can I map Routes?
body: <p>I have three Components : AitemComponent, BitemComponent and CitemComponent. And an Items array contains the list of items. </p>
  
  <p>I want to render the appropriate component according <strong>to the route</strong> ?
  Each Component catch the route parameters and return the item's view. </p>
  
  <pre><code>(this.state.items) ?
                  this.state.items.map(item =&gt; (
                    &lt;Switch&gt;
                      &lt;Route path={"/a/"+item.id} component={AitemComponent} /&gt;
                      &lt;Route path={"/b/"+item.id} component={BitemComponent} /&gt;
                      &lt;Route path={"/c/"+item.id} component={CitemComponent} /&gt;
                    &lt;/Switch&gt;
                  ))
                : null
  </code></pre>
  
  <p>I know that I can instead of the <code>&lt;Route /&gt;</code> just set <code>&lt;Aitem id="item.id" /&gt;</code>. But I want to handle everything using router, is it possible ? Is there any other way if this method sounds weird ?</p>
  
  <p>This won't work and this is the output :</p>
  
  <blockquote>
    <p>Objects are not valid as a React child (found: object with keys {}). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons.</p>
  </blockquote>
  
  <p>Thanks !</p>