Is using the array index as a key okay?
Only for static lists that never change. For dynamic lists where items are added, removed, or reordered, index keys break reconciliation and cause subtle bugs, like inputs showing the wrong data. Use a stable unique id instead.
Verify This Answer
Cross-check this information using these trusted sources:
More FAQs in How to Render Lists in React Using .map() Correctly
Call .map() on your array inside JSX wrapped in curly braces, returning an element for each item. Give every returned element a stable, unique key prop so React can update the list efficiently.
Keys help React identify which items changed, were added, or were removed. They let React match elements between renders so it updates only what changed instead of re-rendering the whole list.
Yes, for complex item markup. Extracting keeps the list readable and makes the item reusable and testable. When you do, put the key on the component in the parent's map, not inside the child.
Still have questions?
Browse all our FAQs or reach out to our support team