Odvisnosti v useEffect v Reactu

Zdaj pa spreminjajmo barvo s klikom na gumb. Ustvarimo stanje color za barvo, ki mu določimo začetno vrednost:

const [color, setColor] = useState('green');

Zamenjajmo nizno vrednost z našim stanjem v useEffect in ne pozabimo ga dodati na seznam odvisnosti v oglatih oklepajih. Zdaj se bo učinek izvajal vsakič, ko se spremeni stanje color:

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

Zdaj pa dodajmo gumb za spreminjanje barve v našo komponento:

return (
	<div>
		<h1>React App</h1>
		<button onClick={changeColor}>spremeni</button>
	</div>
);

Dodajmo tudi funkcijo obdelovalnika klika, ki bo spremenila našo barvo v oranžno:

function changeColor() {
	setColor('orange');
}

Podano je stanje z uporabniškim imenom. Naredite tako, da se ob vsaki spremembi imena vrednost stanja zapiše v lokalno shrambo brskalnika.