وظائف التنظيف للمراجع

في React، تُستخدم المراجع غالبًا للتفاعل مباشرةً مع عناصر DOM. بينما تصف الحالة والخصائص واجهة المستخدم بشكل إعلاني، تتطلب بعض الحالات وصولاً إلزاميًا، مثل تسجيل مستمعي الأحداث، أو تشغيل الرسوم المتحركة، أو اكتشاف النقرات الخارجية. ومثل الآثار الجانبية الأخرى، فإن أي مستمعين أو معالجات DOM تُضاف عبرref ينبغي تنظيفه عند إلغاء تثبيت المكون.

يقدم React 19 طريقة أكثر نظافة للتعامل مع هذا: يمكننا إرجاع دالة التنظيف مباشرة منref رد نداء، تمامًا كما نفعل منuseEffect يؤدي هذا إلى التخلص من القوالب الجاهزة ويحافظ على منطق إعداد DOM وتفكيكه في مكان واحد.

مشكلة مع التنظيف التقليدي

في السابق، كنا نستخدمuseEffect لربط وتنظيف عناصر مثل مستمعي الأحداث أو الرسوم المتحركة. يؤدي هذا غالبًا إلى تقسيم منطق الإعداد والتفكيك على أجزاء مختلفة من المكوّن، مما يُصعّب متابعة الكود.

• السطر 4: إنشاء مرجع (divRef ) للوصول إلى عقدة DOM.

• السطر 7: يحددhandleClick وظيفة يتم تشغيلها عند النقر.

• الأسطر 8-9: ربط مستمع حدث النقر بـdiv باستخدام المرجع. ...