المرجع كدعامة

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

ما هوref ؟

أref (اختصار لـ "مرجع") يُعطينا خطًا مباشرًا إلى عقدة DOM أو مثيل مكون. يشبه الأمر إخبار React:

"مرحبًا، هل يمكنني الحصول على عنصر DOM الفعلي حتى أتمكن من القيام بشيء ما به؟"

يجعل هذا من الممكن التفاعل مع DOM بشكل مباشر، دون المرور عبر عرض React الموجه بالحالة.

• السطر 4: إنشاء مرجع جديد باستخدامuseRef() .

• الأسطر 6-8: الاستخداماتuseEffect للاتصالfocus() على إدخال عند تركيب المكون.

• الخط 10: يعلقref الى<input> العنصر، مما يتيح لنا الوصول المباشر إليه.

ما هيforwardRef وuseImperativeHandle ؟

عندما نريد تمرير مرجع من مكون رئيسي إلى مكون فرعي، لا تقبل مكونات الوظيفة بشكل افتراضيref لجعل هذا ممكنًا، يوفر React أداة مساعدة تسمىforwardRef .

• forwardRef : يسمح للمكون الفرعي بتلقي ...