Как избежать устаревших закрытий внутри использования с SetInterval в React? [дублировать] ⇐ Javascript

[Anonymous]

Я пытаюсь использовать SetInterval внутри eapeffect в функциональном компоненте React для выполнения повторной задачи (например, обновление счетчика или периодическое получение данных). Тем не менее, обратный вызов внутри SetInterval , по -видимому, использует устаревшее состояние - он не доступа к самой последней значению переменной моей состояния. Это приводит к неожиданному поведению в моем приложении. < /P>

Код: Выделить всё

import React, { useState, useEffect } from 'react';

function Timer() {
const [count, setCount] = useState(0);

useEffect(() => {
const interval = setInterval(() => {
console.log('Current count:', count); // This always logs 0
setCount(prev => prev + 1);
}, 1000);

return () => clearInterval(interval);
}, []);

return {count};
}

В этом, console.log (count) всегда регистрирует 0 , хотя пользовательский интерфейс показывает увеличение числа. />
[*] , включая count в массиве зависимостей - но это вызывает создание нескольких интервалов. Я хочу знать

• Почему эта проблема с устаревшим закрытием происходит в использовании ? /> Является ли useref < /code> правильный подход? Есть ли другие лучшие практики реагирования для справки?

Подробнее здесь: https://stackoverflow.com/questions/796 ... l-in-react