Frontend & browser·Rendering and the browser pipeline
you delete the second row and the text you had typed into the third row is suddenly in the second.
List key
Also calledkey prop, keyed list
The stable identifier that tells reconciliation which item in a list is which across renders. Without it, or with the array index used as one, the framework matches items by position, so inserting or removing anything makes state, focus and animations attach to the wrong rows. The fix is always the same and always cheap: use the identifier the data already has.