list key
A list key identifies an item across renders.
Use this when Editing a row affects another row after sorting or inserting.
without the term
“When I sort the list or add an item at the top, the text I typed into one row jumps to a different row. Can you fix it so each row keeps its own input?”
with the term · How do you ask a model for list key?
Use stable identity keys for this editable list. Verify drafts stay with their items after insertion, sorting, and filtering.
What is list key?
React uses the key to match list items between renders. A stable key, such as a database id, keeps each item's state with that item when the list is sorted or changed.
Why does list key matter when vibe coding?
An index or random key can attach state to a position or recreate it unnecessarily.
How do you do list key?
Choose a stable identity that survives the item’s lifecycle and test reordering.
What goes wrong with list key?
Changing an optimistic item’s key when the server assigns its permanent ID.