Функция обратного вызова setInterval не является динамической (реквизит Redux)
У меня есть простой js setInterval, где мой обратный вызов просто проверяет некоторую Redux переменную:
setInterval(() => {
console.info(props.myStateVariable);
}, 5000);
Проблема в том, что он просто печатает то, чем была переменная во время создания экземпляра setInterval. Как сделать его динамичным? Спасибо
редактировать
А что, если этот myStateVariable является строковой переменной длинного редактируемого текста, поэтому я бы не стал переустанавливать этот тайм-аут каждый раз, когда кто-то набирает букву?
Вы пытались использовать хук useSelector? Это то, что я использую для получения динамических значений из хранилища избыточности. react-redux.js.org/api/hooks
На самом деле нет, ни один из комментариев не работает...
@true_gler Вы имеете в виду передать значение реквизита? Но в том-то и дело: я изначально не знаю этого значения и хочу вывести его каждые 5 секунд.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Попробуйте сохранить функцию интервала в переменной, переопределяя функцию интервала каждый раз, когда изменяется props.myStateVariable:
const interval = useRef(null);
useEffect(()=> {
interval.current = setInterval(() => {
console.info(props.myStateVariable);
}, 5000);
return ()=> clearInterval(interval.current);
}, [props.myStateVariable]);
Обновлено:
Если вы не хотите переопределять интервал каждый раз, когда свойство изменяется, вы можете использовать хук useRef для сохранения значения свойства. Таким образом, вы можете получить доступ к его значению:
const propRef = useRef(null);
propRef.current = props.myStateVariable;
useEffect(()=> {
const interval = setInterval(() => {
console.info(propRef.current);
}, 5000);
return ()=> clearInterval(interval);
}, []);
Спасибо, чувак, я слишком долго с этим боролся :)
Добро пожаловать. Также вам не нужно создавать ссылку, вы можете создать переменную внутри useEffect, и она тоже должна работать. useEffect(()=> { const interval = setInterval(() => { console.info(props.myStateVariable); }, 5000); return ()=> clearInterval(interval); }, [props.myStateVariable]). Ссылка полезна, если вам нужно использовать ее в других местах.
Я это знаю, конечно, еще раз спасибо. Теперь я чувствую себя глупо :)
Я отредактировал свой вопрос, может быть, у вас есть ответ?
Да, смотрите мою правку, решение очень похоже :).
Я проверю это завтра. Если это работает, это просто великолепно, и я очень ценю вашу помощь!!
ОК, но я не вижу никаких проблем с переопределением функции интервала, потому что каждый раз, когда это свойство изменяется, компонент будет перерисовываться, и интервал может быть обновлен.
Я получаю сообщение об ошибке: «Невозможно назначить «текущему», поскольку это свойство доступно только для чтения».
Хорошо, теперь это работает :) Я не мог сделать то, что вы предложили, так как я просто проверяю это значение в каком-то совершенно другом компоненте. Интервал должен быть фиксированным. Еще раз большое спасибо, это была блестящая идея!
Как пробовал с состоянием, не сработало. Пробовал с неизменяемым js, не работает. Пробовал с редуксом не получилось. Серьезно реагирующие функциональные компоненты имеют некоторые проблемы с рендерингом. Ваше решение сработало, братан. Спасибо.
Вы пытались передать его как параметр функции?