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

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

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

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

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

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

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

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