Почему state не доступен в interval?

Question

[Ne7Le4Der]

Пытаюсь сделать таймер, код следующий

const [endTime, setEndTime] = useState<number>();
const [timerValue, setTimerValue] = useState<Time>({
        hours: 0,
        minutes: 0,
        seconds: 0
});

useEffect(() => {
        const endTimeUnix = timestamp + minutesLimit * 60;

        setEndTime(endTimeUnix * 1000);

        const timerInterval = setInterval(timer, 1000);

        return () => clearInterval(timerInterval);
}, [timestamp, minutesLimit]);

Но, в функции timer, state endTime равен undefined, как это поправить?

Comments

[Антон Горецкий]

А где расположена ф-я timer? И с чего вы взяли, что endTime должен быть виден вашей ф-и, какие за это есть аргументы?

[Ne7Le4Der]

Антон Горецкий, У меня есть компонент Timer, внутри него useEffect приведённый в примере, и там же функция timer. Если дёрнуть timer, например, в return'е, то endTime не undefined

export const Timer = (...) => {
    const [endTime, setEndTime] = useState<number>();

    useEffect(...);

    const timer = () => {...};
}

[Антон Горецкий]

Установка стейта происходит асинхронно. Читаем документацию
Почему setState даёт неверное значение?

[Alexandroppolus]

кто такие timestamp, minutesLimit? что делает функция timer? endTime как-то используется в возвращаемом jsx?
хорошо бы код полностью

Answer 1

[Антон Горецкий]

Установка стейта происходит асинхронно. Читаем документацию
Почему setState даёт неверное значение?

Answer 2

[black1277]

Добавьте лог сразу после установки нового состояния:

setEndTime(endTimeUnix * 1000);
console.log('endTime', endTime);
const timerInterval = setInterval(timer, 1000);

Вы увидите, endTime undefined. Потому что установка нового стейта не гарантирует, что это произойдет сразу, но гарантирует новое значение при следующем рендере.
Если всё же хочется что-то делать сразу после установки нового стейта - то можно переписать компонент в классовом стиле - там у this.setState вторым параметром передается callback-функция, которая выполняется после установки нового значения стейта.