React · Junior · Question 69 of 75

Why does this list render nothing?

{users.map((u) => {
  <li key={u.id}>{u.name}</li>;
})}

✓Correct answer: The arrow function has a block body without return, so it returns undefined
2map doesn't work in JSX
3key must be on the <ul>

Explanation

Use parentheses for an implicit return: users.map((u) => (<li ...>)), or write return inside the braces.

Further reading

react.dev: Rendering Lists ↗

Test yourself

Take the React · Junior quiz: questions and options are shuffled, and you get a review of your mistakes at the end.