Nalika sampeyan nggawe list, React butuh cara kanggo ngerti item mana sing mana ing antarane render supaya bisa nggunakke sagetik maneh, ngatur ulang, nambah, utawa mbusak DOM nodes kanthi bener. key iku identitas kasebut.
{users.map(user => (
<Row key={user.id} user={user} />
))}
Nganggo index minangka key ngomong marang React "item ing posisi 0 iku item sing padha kaya sadurunge" — sing rusak pas list ngatur ulang, utawa sampeyan nambah/mbusak saka ngarep:
// items: [A, B, C] with keys 0,1,2
// you DELETE A → [B, C], keys become 0,1
// React thinks key 0 (was A) is now B, key 1 (was B) is now C...
// so it keeps the wrong DOM state with the wrong item.
Gejala nyata: list saka input nang sing ngetik ing baris siji "loncat" menyang baris liya sawise mbusak/nyortir, amarga React nggunakke sagetik maneh <input> sing salah (lan internal value/focus-ne).
user.id, slug).Key minangka dhaptar menyang algoritma reconciliation; nggawe bener kadhapatan ngreksa performance lan component state tetep bener.