title: How render react components from array
body: <p>I have several components.</p>
  
  <p>formFields/index.js</p>
  
  <pre><code>export {default as description} from './description/description.component'
  export {default as title} from './title/title.component'
  </code></pre>
  
  <p>I import them and get a list of FormFields in mainComponent</p>
  
  <pre><code>import * as FormFields from '../formFields'
  </code></pre>
  
  <p>How can I use them in render function?</p>
  
  <p>This is one of my failed attempts:</p>
  
  <pre><code>import * as FormFields from '../formFields'
  
  render() {
  
    let properties = ['description', 'title'];
  
    let getComponent = (type) =&gt; {
      let formElement = FormFields[type]
      return &lt;formElement/&gt;
    }
  
    return (
      &lt;div&gt;
        {properties.map((property, i) =&gt; {
          return (
            &lt;div key={i}&gt;
              {getComponent(property)}
            &lt;/div&gt;
          );
        })}
      &lt;/div&gt;
    )
  }
  </code></pre>
  
  <p>This experiment is successful:</p>
  
  <pre><code>render() {
    let EditComponent = FormFields['description']
    return (
      &lt;div&gt;
        &lt;EditComponent/&gt;
      &lt;/div&gt;
    )
  }
  </code></pre>