Avatar ·

كيفية استخدام useRef و createRef بشكل صحيح في React مع TypeScript: كتابة أنواع المراجع

مرحبًا بالجميع! أنا مبتدئ في React و TypeScript، وأواجه مشكلة في استخدام المراجع. أحاول الوصول إلى عنصر DOM (مثل حقل الإدخال) عبر useRef، لكن TypeScript يعطي أخطاء في الأنواع باستمرار. إليك الكود الخاص بي: ```typescript import React, { useRef, useEffect } from 'react'; const MyComponent: React.FC = () => { const inputRef = useRef(null); // خطأ: Argument of type 'null' is not assignable to parameter of type 'HTMLInputElement' useEffect(() => { inputRef.current?.focus(); // خطأ: Property 'focus' does not exist on type 'never' }, []); return ; }; ``` لقد جربت خيارات مختلفة، لكن TypeScript يشتكي إما من تهيئة `useRef(null)` أو من محاولة استدعاء `focus()`. جربت استخدام `createRef` — نفس القصة. في JavaScript كان هذا الكود يعمل دون مشاكل، أما في TypeScript فقد علقت. أرجو إرشادي حول كيفية كتابة أنواع المراجع بشكل صحيح في React + TypeScript؟ هل أحتاج إلى تحديد نوع العنصر بشكل صريح؟ أم أن هناك طريقة أخرى؟