Изменение setTimeout не работает в React с Redux

Question

Итак, у меня есть postActions. js в моем коде, где я пишу все свои коды действий Redux. Одной из функций в нем является код выхода из системы.

Это код.

export const logout = () => {
    localStorage.removeItem('token');
    localStorage.removeItem('expirationDate');
    return {
        type: AUTH_LOGOUT
    }
}

Этот создатель действия выхода из системы вызывается по истечении времени истечения. Это делается с помощью функции setTimeout, как показано ниже.

export const checkAuthTimeout = expirationTime => {
    return dispatch => {
        timeoutVar = setTimeout(() => {
            dispatch(logout());
        }, expirationTime*1000);
    }
} 

timeoutVar объявляется в верхней части кода, вне всех функций, подобных этой.

var timeoutVar;

Теперь вот моя проблема. Когда человек активен в приложении, я хочу изменить setTimeout на более позднее время, чтобы он не выходил из системы, когда он активен. Это делается с помощью такого кода. logoutTime - это новое время, которое будет использоваться для setTimeout.

clearTimeout(timeoutVar);
dispatch(checkAuthTimeout(logoutTime));

По какой-то причине приведенный выше код не меняет setTimeout. Допустим, logoutTime равен 10, предполагается, что setTimeout должен произойти через 10 секунд, но он ничего не меняет.

Если я использую только clearTimeout(timeoutVar), таймер останавливается. Это работает. Но когда я также использую dispatch(checkAuthTimeout(logoutTime)) событие происходит в старое время. Я застрял с этим в течение длительного времени. Пожалуйста помоги.

Answer 1

Я нашел ответ. Наконец.

После React мои компоненты вызывались несколько раз, и это вызывало функцию setTimeout несколько раз. Таким образом, было запущено несколько экземпляров setTimeout. Я вызвал setTimeout вне вызова функции, как это -

clearTimeout(timeoutVar);
dispatch(checkAuthTimeout(logoutTime));

Но checkAuthTimeout также вызывался в других местах без clearTimeout из-за некоторых методов жизненного цикла без clearTimeout, и это создавало много экземпляров setTimeout. Самый безопасный вариант - переместить clearTimeout внутри функции. Вот так.

export const checkAuthTimeout = expirationTime => {
    return dispatch => {
    clearTimeout(timeoutVar); // ADD THIS JUST BEFORE SETTIMEOUT
        timeoutVar = setTimeout(() => {
            dispatch(logout());
        }, expirationTime*1000);
    }
} 

Мне просто нужно было добавить clearTimeout непосредственно перед setTimeout все время.