Když se změní den

Program se rozrostl a server teď má pro každý den jeden soubor: patek.json a sobota.json. Aplikace ukazuje vždy jeden den a tlačítka vybírají který. Vybraný den je ve stavu, na začátku "patek":

const [den, setDen] = useState("patek");

Efekt má načíst soubor vybraného dne, `${den}.json`. Pořád má ale závislosti [], takže se spustí jen jednou, na začátku. Po kliknutí na Sobotu je v den hodnota "sobota", efekt se ale znovu nespustí a stránka dál ukazuje pátek.

Jakmile efekt používá den, patří den do jeho závislostí:

useEffect(() => {
    async function nactiKapely() {
        const odpoved = await fetch(`${den}.json`);
        // Zbytek zůstane, jak byl.
    }
    nactiKapely();
}, [den]);

React teď efekt spustí po prvním vykreslení, kdy je v den hodnota "patek", a pak po každém vykreslení, ve kterém se den změnil. Kliknutí na Sobotu změní stav, React stránku znovu vykreslí, pořád s pátečními kapelami, a pak spustí efekt, který načte sobota.json. Druhé kliknutí na Sobotu den nezmění, a tak se nic znovu nenačítá.

Právě k tomu závislosti slouží: efekt se spustí znovu přesně tehdy, když se změnilo něco, na čem závisí. Pole si můžete představit jako seznam hodnot, jejichž změna znamená, že je práce efektu zastaralá.