A priority list lets users track how many times they have reviewed each item and reorder rows using a Move Up button
Click the counter on an item a few times, then click Move Up. The item moves but the count resets — and the row above it now shows the count instead.
What does React use to decide which component instance to keep when the list changes?
What does React use to decide which component instance to keep when the list changes?
Why this fixes it
key={index} tied each ItemRow to its position. When two items swapped, React reused instances by position — the review counts stayed at their original slots instead of moving with the items. Using key={item.id} tracks each row by item identity, so counts always travel with the correct item regardless of where it moves.