التركيز على حقل بإستخدام useRef

ال useRef بتحتفظ بمرجع للعنصر من غير استخدامه كحالة عرض

المثال داخل مشروع React يدعم JSX و Hooks

تطبيق الفكرة

بنقرأ current وقت الضغط بعد ظهور العنصر

ملف App.jsx

import { useRef } from "react";
export default function App() {
  const field = useRef(null);
  return <><label>Name <input ref={field} /></label><button onClick={() => field.current?.focus()}>Focus Input</button></>;
}

النتيجة

الضغط بينقل التركيز لحقل الإسم