Özet - İleri useRef
- React kursu
- Orta seviye
- Ders 68/80
- 5 dk
Bir input'u forwardRef ile sarıp parent'tan odaklatırsın.
Özet - İleri useRef
Bu grupta useRef ile hesaplama önbelleği, DOM ölçümü ve forwardRef ile ref geçişini öğrendin. useRef çizim tetiklemeden değer tutar; useEffect içinde ölçüm yapılır; forwardRef ref'i alt bileşene iletir.
Bu üç teknik birlikte karmaşık etkileşimler kurar: önbellekli hesap, ölçüm tabanlı yerleşim ve erişilebilir alt bileşenler. Son adımda üçünü birleştireceksin.
Uygulama Özet forwardRef
Aşağıdaki iskeleti tamamla. FancyInput bileşenini forwardRef ile yaz; (props, ref) alsın ve <input ref={ref} {...props} /> döndürsün. Dışa aktar.
Başlangıç kodu
import { forwardRef } from "react";
// FancyInput bileşenini buraya yazÖrnek çözüm
import { forwardRef } from "react";
const FancyInput = forwardRef((props, ref) => {
return <input ref={ref} {...props} />;
});
export default FancyInput;Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 DOM ölçümü hangi hook ile yapılır?
- useState
- useCallback
- useEffect Doğru cevap
- useMemo
Açıklama: Ölçüm useEffect içinde yapılır.
2 Özet eşleştir
| Kavram | Anlamı |
|---|---|
useRef |
Değer tutar |
useEffect |
Ölçüm yapar |
forwardRef |
Ref iletir |
current |
Ref özelliği |