Хук эффекта useEffect в React
Для работы с эффектами применяется
хук useEffect
.
Давайте посмотрим на его работу.
Для начала импортируем наш хук:
import { useEffect } from 'react';
Создадим компонент App
, содержащий
заголовок:
function App() {
return (
<div>
<h1>React App</h1>
</div>
);
}
export default App;
Предположим, что нам надо сделать какое-то действие после рендеринга, например, установить цвет фона всей страницы. В данном случае внешней системой будет DOM браузера.
Применим наш хук:
function App() {
useEffect(() => {
document.body.style.backgroundColor = 'green';
}, []);
...
}
Во втором параметре передается массив зависимостей. В них входят значения, используемые функциями компонента. Пока мы оставили их пустыми. В этом случае цвет установится в зеленый только один раз после рендеринга. Совсем убрать второй параметр нельзя, так как ваш компонент может войти в бесконечный цикл.
С помощью хука useEffect
поменяйте
тайтл страницы.