list in react 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 list
const todoItems = todos.map((todo) =>
<li key={todo.id}> {todo.text}
</li>
);
Example 3: 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}
Example 4: jsx map with index
materials.map((material,index) => console.log(index +" = " + material + " = " + materials[index]));