જ્યારે તમે સૂચી આપો છો, React ને કોણ વસ્તુ અલગ છે તે જાણવાની રીત જરૂરી છે render વચ્ચે તેથી તે DOM નોડ્સને યોગ્યરીતે પુનઃવર્તમાન, પુનઃક્રમમાં, નીકાલવું, અથવા કાઢી નાખી શકે. key તે ઓળખ છે.
{users.map(user => (
<Row key={user.id} user={user} /> // stable, unique id
))}
જો તમે અનુક્રમણિકાને key તરીકે વાપરો છો, તો React "સ્થિતિ 0 પર અગાઉ જેવો જ વસ્તુ છે" કહે છે — જે તરત જ તોડી જાય છે જ્યારે સૂચી પુનઃક્રમમાં હોય, અથવા તમે આગળથી નીકાલો/કાઢો:
// 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.
વાસ્તવિક લક્ષણ: input ની સૂચી જ્યાં એક હાર માં ટાઈપ કરવું બીજી હાર માં "કૂદી" જાય છે, કારણ કે React ખોટી <input> નો પુનઃવર્તમાન કર્યો (અને તેનું આંતરિક મૂલ્ય/ફોકસ).
user.id, slug).Key એક સંકેત છે reconciliation algorithm માટે; તેને યોગ્યમાં પ્રાપ્ત કરવું બંને કર્મક્ષમતા અને ઘટક state સાચો રાખે છે.