کلیدها (keys) در ReactJS – آموزش ReactJS

  • سه شنبه ۲۱ اسفند ۱۳۹۷
  • بازدید ۲۷۰ نفر

کلیدها keys در ReactJS 6155 تصویر

کلیدها (keys) در ReactJS

کلیدها در ReactJS در هنگام کار با لیست هایی که توسط کاربران تغییر یافته اند یا هنگام کار با کامپوننت هایی که به صورت پویا (dynamically) ایجاد شده اند، مفید هستند.

کلیدها (keys) در ReactJS

در این مثال ما به صورت پویا چند عنصر Content با index منحصر به فرد تولید می کنیم. تابع map با توجه به داده های موجود در state، سه عنصر div ایجاد خواهد کرد. از آن جا که مقدار کلید برای هر عناصر باید به صورت منحصر به فرد باشد، مقدار i را به عنوان کلید برای عناصر مشخص کرده ایم.

محتوای فایل App.jsx:

محتوای فایل main.js:

خروجی مثال فوق برای مقدار کلید هر عنصر:

react keys example 6155 تصویر

اگر در آیند بعضی از عناصر را حذف، اضافه یا ترتیب آن ها به صورت پویا تغییر دهیم، React از مقادیر کلیدها برای شناسایی هر عنصر استفاده خواهد کرد.

ثبت نظر
ریفریش کنید!
نظرات کاربران (۰ مورد)

هیچ نظری ثبت نشده است