Reactdagi useEffect Effekt Huki

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

Boshlanishiga hugimizni import qilamiz:

App.jsximport { useEffect } from 'react';

Sarlavhani o'z ichiga olgan App komponentini yaratamiz:

App.jsxfunction 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:

App.jsxfunction 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.

Задание 1

useEffect hugi yordamida sahifa sarlavhasini o'zgartiring.