كيفية عرض مكون معين عدد من المرات في React؟

Emad Saif · 22 يونيو 2022

أحاول أن أقوم بعرض عنصر tr لعشر مرات في جدول table ، لذلك قمت بكتابة for loop وتقوم هذه الحلقة بإضافة العناصر في متغير في شكل مصفوفة

var cells = [];
for (var i = 0; i < 10; i++) {
  cells.push(<tr><td>{i}</td></tr>);
}

ثم أستعمل map لعرض هذه المصفوفة في الصفحة، المشكلة أني أكتب الكثير من الأكواد غير الضرورية ولا يمكن إستعمال for داخل JSX

هل توجد طريقة أفضل لعرض مكون محدد لعدد من المرات بحيث يتم إستعمال jsx فقط؟

Wael Aljamal · 22 يونيو 2022

يمكن حل المشكلة بتوليد مصفوفة أرقام، ثم عمل map 8 عليها مع توليد عنصر سطر جدول لكل رقم وهو ما يوافق الشيفرة لديك

{[...Array(n)].map((e, i) => <tr><td>{i}</td></tr>)}

أو بالطريقة التالية من خلال Array.from

 {Array.from({ length: 10 }, (_, i) => <tr><td>{i}</td></tr>)}

السؤال