Skip to content

Instantly share code, notes, and snippets.

@jlittlejohn
Created May 1, 2019 19:03
Show Gist options
  • Save jlittlejohn/5d5cfed4adc60296b6d9ad45ba1f3880 to your computer and use it in GitHub Desktop.
Save jlittlejohn/5d5cfed4adc60296b6d9ad45ba1f3880 to your computer and use it in GitHub Desktop.
REACT: Render an Array of Objects in a Class Component
var users = [
{ id: 1, name: "Chris" },
{ id: 2, name: "Jeff" },
{ id: 3, name: "Julie" },
{ id: 4, name: "Jessica" }
];
class UserList extends React.Component {
render() {
var users = this.props.users;
var usersListItems = users.map(function(user) {
return <div key={user.id}>{user.name}</div>;
});
return <div>{usersListItems}</div>;
}
}
// or
// class UserList extends React.Component {
// render() {
// var users = this.props.users;
// return (
// <div>
// {users.map(function(user) {
// return <div key={user.id}>{user.name}</div>;
// })}
// </div>
// );
// }
// }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment