Vilete katika useEffect katika React

Sasa badilisha rangi kwa kubonyeza kitufe. Tutaweka hali color kwa rangi, tukiipa thamani ya kuanzia:

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

Badilisha thamani ya kamba na hali yetu katika useEffect na usisahau kuiongeza kwenye orodha ya vilete kwenye mabano mraba. Sasa athari itatekelezwa kila wakati hali color inapobadilika:

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

Sasa ongeza kitufe kubadilisha rangi kwenye kijenzi chetu:

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

Pia ongeza kitendakazi kisukumizi cha kubonyeza, kitakachobadilisha rangi yetu kuwa ya machungwa:

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