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

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

ما هو ref ؟

ref (Ref) يُعطينا خطًا مباشرًا إلى عقدة DOM أو نسخة مكون. يشبه الأمر إخبار React:

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

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

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

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

• السطر 10: يربط ref بعنصر ، مما يمنحنا إمكانية الوصول المباشر إليه.

ما هما forwardRef و useImperativeHandle ؟

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

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