Priklausomybės useEffect hook'e React

Dabar keiskime spalvą paspaudus mygtuką. Sukurkime būseną color spalvai, nustatydami pradinę reikšmę:

App.jsxconst [color, setColor] = useState('green');

Pakeiskime eilutės reikšmę mūsų būsenos reikšme useEffect ir nepamirškime jos pridėti į priklausomybių sąrašą laužtiniuose skliaustuose. Dabar efektas bus vykdomas kaskart pasikeitus būsenos reikšmei color:

App.jsxfunction App() {
  useEffect(() => {
    document.body.style.backgroundColor = color;
  }, [color]);
  
  ...
}

Dabar pridėkime mygtuką spalvai keisti į mūsų komponentą:

App.jsxreturn (
  <div>
    <h1>React App</h1>
    <button onClick={changeColor}>change</button>
  </div>
);

Taip pat pridėkime paspaudimo apdorojimo funkciją, kuri pakeis mūsų spalvą į oranžinę:

App.jsxfunction changeColor() {
  setColor('orange');
}