Skip to content

Warning: Each child in a list should have a unique “key” prop – How to fix this react error?

<ul>
  {["Item1", "Item2", "Item3"].map(item =>
  <li>{item}</li>
  )}
</ul>

When creating a list in the UI from an array with JSX, you might get this error.

Warning: Each child in a list should have a unique "key" prop

To fix this we should add a key prop to each child and to any of its’ children.

<ul>
  {["Item1", "Item2", "Item3"].map(item =>
  <li key="{item}">{item}</li>
  )}
</ul>
See also  Using HTTPS in Create React App

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.