1constructor() { 2 super(); 3 this.state = { 4 employees: [ 5 { 6 firstname: "FirstName123", 7 lasttname: "LastName123" 8 }, 9 { 10 firstname: "FirstName456", 11 lasttname: "LastName456" 12 } 13 ] 14 }; 15} 1render() { 2 const { employees } = this.state; //Destructuring 3 4 return ( 5 <div> 6 <div> 7 {employees.map(employee => ( 8 <p key={employee.firstname}> 9 {employee.firstname} : {employee.lasttname} 10 </p> 11 ))} 12 </div> 13 </div> 14 ); 15}
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter