Event Bubbling Across Portalsاستمرار صعود الأحداث عبر البوابات
تجاوز قيود القص والترتيب البصري للحاويات برسم النوافذ الحوارية عبر createPortal، وافهم صعود الأحداث عبر شجرة React، واعزل أعطال التصيير بأمان عبر Error Boundaries.
3 صفوف تعليمية
ReactJS
0 مشاهدة
شرح صفوف ومحتوى الفقرة
الصف 1
شرح توضيحي
هناك تفصيل معماري بالغ الأهمية يفاجئ حتى المطورين المتمرسين: تصعد الأحداث التفاعلية داخل البوابة عبر شجرة مكونات React المنطقية، وليس عبر شجرة HTML الفيزيائية فقط!
فإذا وضعت بوابة نافذة حوارية داخل عنصر أب يملك معالج onClick، فإن النقر على زر الإغلاق داخل النافذة المرسومة في document.body سيصعد عبر شجرة React ويشغّل معالج النقر في الأب ما لم توقف الانتشار عبر e.stopPropagation() أو تضع مكون النافذة خارج العنصر القابل للنقر.
الصف 2
صورة توضيحية
الصف 3
ملاحظة هامة
جميع فقرات هذا الدرس (العرض عبر البوابات createPortal وحدود عزل الأخطاء)
