ReactJS: Как узнать, какая зависимость вызвала запуск/срабатывание хука useEffect?

Пример кода:

useEffect(() => {

//I want to know which was the variable which made the useffect run. var1 or var2. how can I?

}, [var1, var2]);

какая зависимость использовалась для запуска?

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
9
0
5 030
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Самый простой способ добиться желаемого результата без сторонних библиотек и большого количества кода — разбить useEffect на два useEffect хука и один обработчик.

Решение 1

const handler = () => {
    // ...some logic
};

useEffect(() => {
    // var1 has been changed
    handler();
}, [var1]);

useEffect(() => {
    // var2 has been changed
    handler();
}, [var2]);

Решение 2

Используйте useRef, чтобы сохранить предыдущее состояние, а затем сравните результаты.

const prevVar1 = useRef();
const prevVar2 = useRef();

useEffect(() => {
    if (prevVar1.current !== var1) {
        // var1 has been changed
    }
    if (prevVar2.current !== var2) {
        // var2 has been changed
    }

    // and update the previous state
    prevVar1.current = var1;
    prevVar2.current = var2;

    // ...some logic
}, [var1, var1]);

Решение 3

Или используйте библиотеку use-what-changed

Другие вопросы по теме