شرح صفوف ومحتوى الفقرة
عندما يحتاج المكون إلى تذكر بيانات تظهر للمستخدم على الشاشة نعتمد على useState كي تعيد React رسم الواجهة مع كل تحديث. غير أن المكونات تحتاج أحياناً إلى تذكر قيم داخلية خلف الكواليس — مثل معرّف مؤقت نشط أو طابع زمني سابق أو عداد تشخيصي — لا يغير تعديلها شكل العناصر المرسومة إطلاقاً.
هنا توفر مكتبة React خطاف useRef بوصفه منفذاً هندسياً صامتاً (Escape Hatch) يحتفظ بالقيمة بين مرات التصيير المتتالية دون أن يطلب إعادة تصيير المكون عند الكتابة فيه.
HTML
const silentClicksRef = useRef(0);
const [report, setReport] = useState('No snapshot yet');
function handleSilentClick() {
silentClicksRef.current += 1;
}
function handleReveal() {
setReport('Saved in ref: ' + silentClicksRef.current);
}