Závislosti v useEffect v Reacte
Teraz budeme meniť farbu kliknutím
tlačidla. Vytvoríme stav color pre farbu,
nastavením počiatočnej hodnoty:
const [color, setColor] = useState('green');
Nahradíme reťazcovú hodnotu naším stavom
v useEffect a nezabudnime ho pridať
do zoznamu závislostí v hranatých zátvorkách.
Teraz sa efekt bude vykonávať každý
raz pri zmene stavu color:
function App() {
useEffect(() => {
document.body.style.backgroundColor = color;
}, [color]);
...
}
Pridajme teraz tlačidlo pre zmenu farby do nášho komponentu:
return (
<div>
<h1>React App</h1>
<button onClick={changeColor}>change</button>
</div>
);
Pridajme tiež funkciu obsluhy kliknutia, ktorá bude meniť našu farbu na oranžovú:
function changeColor() {
setColor('orange');
}
Je daný stav s menom používateľa. Urobte tak, aby zakaždým pri zmene mena, hodnota stavu sa zapísala do lokálneho úložiska prehliadača.
