Reactdagi useEffect Effekt Huki

Effektlar bilan ishlash uchun useEffect hugi qo'llaniladi. Keling, uning ishlashini ko'rib chiqaylik.

Boshlanishiga hugimizni import qilamiz:

import { useEffect } from 'react';

Sarlavhani o'z ichiga olgan App komponentini yaratamiz:

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

export default App;

Faraz qilaylik, render qilingandan keyin qandaydir harakat qilishimiz kerak, masalan, butun sahifaning fon rangini o'rnatish. Bu holatda tashqi tizim brauzerning DOM'i bo'ladi.

Hugimizni qo'llaymiz:

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

Ikkinchi parametrda bog'liqliklar massivi uzatiladi. Ular komponent funksiyalari tomonidan ishlatiladigan qiymatlarni o'z ichiga oladi. Hozircha biz ularni bo'sh qoldirdik. Bu holda fon rangi faqat bir marta render qilingandan keyin o'rnatiladi. Ikkinchi parametrni butunlay olib tashlab bo'lmaydi, chunki sizning komponentingiz cheksiz tsiklga kirishi mumkin.

useEffect hugi yordamida sahifa sarlavhasini o'zgartiring.