Таймер обратного отсчёта застыл после первой секунды
function Countdown() {
const [seconds, setSeconds] = useState(60);
useEffect(() => {
const id = setInterval(() => setSeconds(seconds - 1), 1000);
return () => clearInterval(id);
}, []);
return <span>{seconds}</span>;
}
Таймер показывает 59 и дальше не меняется. Почему?
- Колбэк замкнул seconds = 60 первого рендера — нужно setSeconds((s) => s - 1)
- setInterval внутри useEffect срабатывает только один раз
- clearInterval вызывается после каждого тика и останавливает таймер
- React не перерисовывает компонент, если значение изменилось на единицу
