Özet - useEffect
- React kursu
- Başlangıç
- Ders 68/84
- 5 dk
Bir pencere boyutu değişimini dinleyen bir kanca yazarsın.
Özet - useEffect
Bu grupta useEffect'i öğrendin. Yan etkileri render'dan sonraya taşır; ilk render dahil her çizimden sonra çağrılır.
Bağımlılık dizisi ne zaman çalışacağını söyler: [] ilk render, [deps] değişince, yoksa her render. Temizlik fonksiyonu kaynağı bırakır.
Doğru bağımlılık ve temizlik, sağlıklı effect'lerin anahtarıdır.
Uygulama useEffect özet görevi
Aşağıdaki iskeleti tamamla. Logger bileşeni yaz; useState ve useEffect'i içe aktar. const [n, setN] = useState(0); tanımla. useEffect(() => { console.log(n); }, [n]); çağır. <button onClick={() => setN(n + 1)}>{n}</button> döndür. Dışa aktar.
Başlangıç kodu
import { useState, useEffect } from "react";
// Logger bileşenini buraya tanımlaÖrnek çözüm
import { useState, useEffect } from "react";
function Logger() {
const [n, setN] = useState(0);
useEffect(() => { console.log(n); }, [n]);
return <button onClick={() => setN(n + 1)}>{n}</button>;
}
export default Logger;Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Aşağıdakilerden hangisi yanlış?
Cleanup prevents leaks.- useEffect render'dan sonra çalışır
- temizlik hiç gerekmez Doğru cevap
- [count] count değişince çalışır
- [] ilk render demektir
Açıklama: Temizlik kaynak varsa zorunludur.
2 Özet - useEffect: kavramları eşleştir
| Kavram | Anlamı |
|---|---|
useEffect |
Yan etki hook'u |
[] |
İlk render |
[deps] |
Değişince |
return () => ... |
Temizlik |