Massiv indeksini açar kimi ötürsəniz, nə baş verər?

React-də massiv indeksini açar (key) kimi istifadə etmək performans və komponentlərin yenilənməsinin düzgünlüyü ilə bağlı problemlərə səbəb ola bilər. Elementlərin sırası dəyişdikdə və ya elementlər əlavə və ya silindikdə, indekslər dəyişir və React səhvən komponentləri uyğunlaşdıra bilər, bu da artıq yenidən çəkilişlərə və ya vəziyyətin itirilməsinə səbəb olar.

Məsələn, sizdə siyahı varsa:

{items.map((item, index) => (
  <ListItem key={index} item={item} />
))}

Və siz massivə yeni element əlavə etsəniz, bütün açarlar hərəkət edəcək və React demək olar ki, bütün komponentləri yenidən yaradacaq, halbuki yalnız birini yeniləmək mümkün olardı.

Məlumatlardan unikal və sabit identifikatorlar, məsələn id, istifadə etmək daha yaxşıdır:

{items.map(item => (
  <ListItem key={item.id} item={item} />
))}