correct-react-key-usage.jsx

function ListItem(props) {
  // Correct! There is no need to specify the key here:
  return <li>{props.value}</li>;
}

function UserList(props) {
  const users = props.users;
  const listItems = users.map((user) =>
    // Correct! Key should be specified inside the array.
    <ListItem key={user.id.toString()}
              value={user.name} />
  );
  return (
    <ul>
      {listItems}
    </ul>
  );
}

const users = [ 
  {id: 1, name: 'Khaleesi'} , 
  {id: 2, name: 'Jon'}, 
  {id: 3, name: 'Arya'}
];

<UserList users={users} />