Инициализация одного таймера с помощью redux-thunk в реакции - PullRequest
Новая
       83

Инициализация одного таймера с помощью redux-thunk в реакции

0 голосов
/ 06 мая 2020

В настоящее время я использую побочный эффект для таймера, который отправляет действие обновления в хранилище каждые 0,1 с: 

const Timer = ({ update, score }) => {
  useEffect(() => {
    const interval = setInterval(() => {
        update()
    }, 100);
    return () => clearInterval(interval);
  })
  return (<p>{score}</p>);
}

Где лучше всего инициализировать таймер в incrementAsynch ()? 

function incrementAsync() {
  return (dispatch) => {
    setTimeout(() => {
      dispatch(update());
    }, 100);
  };
}

Следует ли мне оставить его в использовании Эффект? 

const Timer = ({ update, score }) => {
  useEffect(() => {
    incrementAsync()
    return () => clearInterval(interval);
  })
  return (<p>{score}</p>);
}

Если да, то как мне его остановить? И создает ли это несколько счетчиков?

1 Ответ

0 голосов
/ 07 мая 2020

каждый раз, когда вы отправляете свой incrementAsyn c, начинается новый интервал, но старые не уничтожаются. поэтому, если вы отправите 3 раза, вы получите 30 обновлений в секунду.

Redux-Thunk не очень подходит для таких случаев. Я бы посоветовал вам попробовать промежуточное ПО, которое лучше подходит для таких задач.

Наиболее важные из них - redux-saga - redux-observable

Оба промежуточного программного обеспечения также имеют функции для отмены таких таймеров

...