TG Telegram Group & Channel
Frontend разработчик | United States America (US)
Create: Update:

🚨 Осторожно с useEffect: ловушка зависимости на функцию!

В React легко попасть в ловушку, передавая функции внутрь useEffect, не задумываясь об их зависимости.


useEffect(() => {
fetchData(); // ⚠️ Эта функция может пересоздаваться на каждый рендер!
}, [fetchData]);


Если fetchData определена внутри компонента, она будет новой при каждом рендере, и эффект снова выполнится. Это может вызвать бесконечные циклы или лишние вызовы.

🛠 Решения:

1. Вынести функцию наружу, если она не зависит от пропов/стейта.
2. Обернуть в useCallback:


const fetchData = useCallback(() => {
// ...
}, []);


📌 Всегда проверяй зависимости в useEffect. Полагайся на ESLint-плагин react-hooks — он поможет не попасть в ловушку.

👉 @frontend_1

🚨 Осторожно с useEffect: ловушка зависимости на функцию!

В React легко попасть в ловушку, передавая функции внутрь useEffect, не задумываясь об их зависимости.


useEffect(() => {
fetchData(); // ⚠️ Эта функция может пересоздаваться на каждый рендер!
}, [fetchData]);


Если fetchData определена внутри компонента, она будет новой при каждом рендере, и эффект снова выполнится. Это может вызвать бесконечные циклы или лишние вызовы.

🛠 Решения:

1. Вынести функцию наружу, если она не зависит от пропов/стейта.
2. Обернуть в useCallback:


const fetchData = useCallback(() => {
// ...
}, []);


📌 Всегда проверяй зависимости в useEffect. Полагайся на ESLint-плагин react-hooks — он поможет не попасть в ловушку.

👉 @frontend_1


>>Click here to continue<<

Frontend разработчик






Share with your best friend
VIEW MORE

United States America Popular Telegram Group (US)