بسیاری از توسعهدهندگان این کار را انجام میدهند:
{users.map((user, index) => ( <UserCard key={index} user={user} /> ))} در ظاهر درست است.
اما اگر آیتمی حذف یا جابهجا شود:
❌اجرای Renderهای غیرمنتظره
❌ از دست رفتن State
❌ باگهای عجیب در UI
راه بهتر:
{users.map(user => ( <UserCard key={user.id} user={user} /> ))} 🎯 ریکت (React) از Key برای تشخیص هویت عناصر استفاده میکند.
یکKey اشتباه یعنی React نمیداند کدام عنصر واقعاً تغییر کرده است.
💡 یکی از باگهای سخت Frontend از همین یک خط ساده شروع میشود.
#ReactJS #JavaScript #Frontend #Performance