React-da useEffect Effekt Huku

Effektlərlə işləmək üçün hok useEffect tətbiq edilir. Gəlin onun işinə nəzər salaq.

Əvvəlcə hokumuzu import edək:

import { useEffect } from 'react';

Başlıq ehtiva edən App komponentini yaradaq:

function App() {
	return (
		<div>
			<h1>React App</h1>
		</div>
	);
}

export default App;

Tutaq ki, render etmədən sonra hansısa əməliyyat etməliyik, məsələn, bütün səhifənin fon rəngini təyin etməliyik. Bu vacibdə xarici sistem brauzerin DOM-u olacaq.

Hokumuzu tətbiq edək:

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

Ikinci parametrdə asılılıqlar massivi ötürülür. Onlara komponentin funksiyaları tərəfindən istifadə edilən dəyərlər daxildir. Hələlik biz onları boş buraxdıq. Bu halda rəng yalnız bir dəfə, render etmədən sonra yaşıl olaraq təyin olunacaq. Ikinci parametri tamamilə çıxarmaq olmaz, çünki komponentiniz sonsuz dövrəyə düşə bilər.

useEffect hokunun köməyi ilə səhifənin title-nı dəyişdirin.