شرح صفوف ومحتوى الفقرة
يضمن الالتزام بأعراف التسمية القياسية في مجتمع React وضوح شجرة المكونات مهما كبر حجم المشروع؛ فتبدأ خصائص الأحداث المستقبَلة في المكون بالسابقة on متبوعة بحرف كبير مثل onSelectLesson، بينما تبدأ الدوال المعالجة الداخلية بالسابقة handle مثل handleSelectLesson. يلخص الجدول التالي أنماط ربط الأحداث:
| النمط البرمجي | المثال في JSX | السلوك الفعلي وقت التشغيل |
|---|---|---|
| تمرير مرجع الدالة | onClick={handleSave} | يمرر الدالة بأمان لتشتغل عند نقر المستخدم فقط |
| الاستدعاء المبكر الخاطئ | onClick={handleSave()} | يشغّل الدالة فوراً أثناء الرسم قبل حدوث أي نقرة |
| الغلاف السهمي المختصر | onClick={() => onPick(id)} | يمرر معاملات مخصصة للعنصر عند لحظة التفاعل |
| خاصية حدث مخصصة | <Card onArchive={handleArchive} /> | يفصل تصميم المكون الفرعي عن منطق المكون الأب |
ملخص الدرس
حصاد الدرسمراجعة مركّزة لأهم المفاهيم والقواعد الهندسية التي أتقنتها في هذا الدرس قبل التطبيق العملي
ماذا تعلّمت في هذا الدرس؟
تعلمت في هذا الدرس كيفية ربط خصائص الأحداث بصيغة camelCase، وتمرير مراجع الدوال دون استدعاء مبكر أثناء التصيير، وتمرير المعاملات بالدوال السهمية، وقراءة الخصائص داخل نطاق الدالة وتصميم خصائص الأحداث بالأعراف القياسية. الخطوة التالية: انتقل الآن إلى الدرس رقم 17 «الأحداث الاصطناعية وانتشار الحدث والسلوك الافتراضي» لمواصلة البناء التراكمي المتدرج في مسار React الحديث.