I have following code where i am trying to load images from Array, if i try to load a single image it works fine, but if i try to load multiple images it dosent show any image, tho my div test
is in the dom.
import React, {Component} from 'react';
class Slider extends Component {
render() {
const myItems = [{source_image: '1.jpg'}, {source_image: '2.jpg'}, {source_image: '3.jpg'}];
return (
<div id="test">
{myItems.map(function (a) {
<img src={"images/"+a.source_image}/>
}
)}
</div>
);
}
}
export default Slider;
You forget return in map:
{myItems.map(function (a) {
return <img src={"images/"+a.source_image}/> // here
})
}
{myItems.map(a => <img src={"images/"+a.source_image}/>)} //this is more clear, I think