Блог

Главная - Вопросы по программированию - как реализовать обратный отсчет реакции с использованием одного хука useState?

как реализовать обратный отсчет реакции с использованием одного хука useState?

#javascript #reactjs #react-hooks

#javascript #reactjs #реагирующие хуки

Вопрос:

я пытаюсь сделать обратный отсчет в формате 00:00.
я могу реализовать это с использованием двух useState, однако я хочу сделать это с использованием одного useState

 const [counter, setCounter] = React.useState([12, 0]);

React.useEffect(() => {
  const timer =
    counter > 0 amp;amp;
    setInterval(() => {
      setCounter([counter[0] - 1,Math.floor((counter[1] % 3600) / 60)]);
    }, 1000);
  return () => clearInterval(timer);
}, [counter]);

Ответ №1:

Вы должны хранить свой счетчик как секунды / минуты. При рендеринге вы можете преобразовать его, например, в формат MM: SS, используя что-то вроде этого:

 function secondsToMMSS(seconds) {
    var m = Math.floor(seconds / 60);
    var s = seconds % 60;

    return (m < 10 ? '0' : '')   m   ":"   ('0'   s).slice(-2);
}