ListRenderExamples.jsx

/* Pass list as props ... */
class Song extends React.Component {
  render = () => <span>{this.props.song.title}</span>
}
class Album extends React.Component {
  render = () => (
    <section>
      {this.props.songs.map(song => (
        <Song song={song} />
      ))}
    </section>
  );
}
/* ... and render it like that */
<Album songs={songs} />
  
/* Pass list as children ... */
class Album extends React.Component {
  render = () => (
    <section>
      {this.props.children}
    </section>
  );
}
/* ... and render it like that */
<Album>
  {songs.map(song => (
    <Song song={song} />
  ))}
</Album>