title: React won't render within map function
body: <p>I'm trying to render an array containing some objects using the JS function map().
  However when I return the text nothing is shown: </p>
  
  <pre><code>console.log(this.props.project.projects); // (2) [{…}, {…}]
    this.props.project.projects.map((item, index) =&gt; {
      console.log(item.projectDescription); //"Testproject"
      return (
          &lt;div key={index}&gt;
           {item.projectDescription}
          &lt;/div&gt;
        )
    })
  </code></pre>
  
  <p>I just don't get it, why there is no text shown, since the console.log(item.projectDescription) shows exactly what I want to display.</p>
  
  <p><strong>Update:</strong>
  It works when I change it to this:</p>
  
  <pre><code>return this.props.project.projects.map((item, index) =&gt; (
          &lt;div key={index} style={{ color: '#fff' }}&gt;
           {item.projektBeschreibung}
          &lt;/div&gt;
        ))
  </code></pre>
  
  <p>I already thought about using the foreach-method but I think it should actually work using the map()-function.</p>
  
  <p>Here you can see also the render method of my Component.</p>
  
  <pre><code>class ProjectRow extends Component {
  
    renderProjects() {
      console.log(this.props.project);
      if (this.props.project.loading) {
      return (
        &lt;div style={{color: '#fff'}}&gt;
          Loading
        &lt;/div&gt;
      )
      } else {
        console.log(this.props.project.projects);
        this.props.project.projects.map((item, index) =&gt; {
          console.log(item);
          console.log(item.projektBeschreibung);
          console.log(index);
          return (
              &lt;div key={index}&gt;
               {item.projektBeschreibung}
              &lt;/div&gt;
            )
        })
      }
    }
  
    render() {
      return (
        &lt;div&gt;
          {this.renderProjects()}
        &lt;/div&gt;
      );
    }
  }
  </code></pre>