React-та useEffect-тегінің тәуелділіктері

Енді түсті батырманы басу арқылы өзгертейік. Түс үшін color стейтін құрайық, оған бастапқы мән бере отырып:

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

useEffect-тегі жол мәнін біздің стейтімізбен ауыстырайық және оны тәуелділіктер тізіміне шаршы жақшаға қосуды ұмытпайық. Енді эффект әр жолы color стейті өзгерген кезде орындалады:

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

Енді компонентімізге түсті өзгерту үшін батырма қосамыз:

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

Сондай-ақ, түсті қызғылт сарыға өзгертетін шықылдату өңдегішінің функциясын қосамыз:

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

Пайдаланушы аты бар стейт берілген. Ат әр өзгерген сайын, стейт мәні шолғыштың жергілікті сақтағышына жазылатындай етіңіз.