function IdiomaticReactList(props) { return ( <div> {props.items.map((item, index) => ( <Item key={index} item={item} /> ))} </div> );} code example
Example 1: map function in react
function NameList() {
const names = ['Bruce', 'Clark', 'Diana']
return (
<div>
{names.map(name => <h2>{name}</h2>)}
</div>
)
}
Example 2: react create list of array in react
const App = props => { const quoteArray = props.quotes.map((quote) => { return ( <Quote text={quote.text} author={quote.author} /> ); }); return ( <div> <h2>Famous Quotes</h2> {quoteArray} </div> );};App.propTypes = { quotes: React.PropTypes.array}