React - dynamic images in a map

Question

React newbie here.

I have a map of labels ['a', 'b', 'c']

I have images for each (a.jpg, b.jpg, c.jpg)

How would I include/require iterate and display each image as part of my map?

Any help appreciated :D

Answer 1

var Foo = React.createClass({
  render: function() {
   const images = ['a','b','c']
   const imagesElements = images.map( e => {
    return (
     <img src={`${e}.jpg`} />
    )
   });

   return(
    <div>
     {imagesElements}
    </div>
   )
 }
});

ReactDOM.render(
 <Foo name="bar" />,
 document.getElementById('container')
);

https://jsfiddle.net/69z2wepo/83751/