Функция обратного вызова setInterval не является динамической (реквизит Redux)

У меня есть простой js setInterval, где мой обратный вызов просто проверяет некоторую Redux переменную:

setInterval(() => {
    console.info(props.myStateVariable);
}, 5000);

Проблема в том, что он просто печатает то, чем была переменная во время создания экземпляра setInterval. Как сделать его динамичным? Спасибо

редактировать

А что, если этот myStateVariable является строковой переменной длинного редактируемого текста, поэтому я бы не стал переустанавливать этот тайм-аут каждый раз, когда кто-то набирает букву?

Вы пытались передать его как параметр функции?

true_gler 14.12.2020 16:15

Вы пытались использовать хук useSelector? Это то, что я использую для получения динамических значений из хранилища избыточности. react-redux.js.org/api/hooks

Viet 14.12.2020 16:25

На самом деле нет, ни один из комментариев не работает...

k-wasilewski 14.12.2020 17:06

@true_gler Вы имеете в виду передать значение реквизита? Но в том-то и дело: я изначально не знаю этого значения и хочу вывести его каждые 5 секунд.

k-wasilewski 14.12.2020 17:18
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
4
257
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 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);
}, []);

Спасибо, чувак, я слишком долго с этим боролся :)

k-wasilewski 14.12.2020 17:27

Добро пожаловать. Также вам не нужно создавать ссылку, вы можете создать переменную внутри useEffect, и она тоже должна работать. useEffect(()=> { const interval = setInterval(() => { console.info(props.myStateVariable); }, 5000); return ()=> clearInterval(interval); }, [props.myStateVariable]). Ссылка полезна, если вам нужно использовать ее в других местах.

lissettdm 14.12.2020 17:33

Я это знаю, конечно, еще раз спасибо. Теперь я чувствую себя глупо :)

k-wasilewski 14.12.2020 17:38

Я отредактировал свой вопрос, может быть, у вас есть ответ?

k-wasilewski 14.12.2020 18:21

Да, смотрите мою правку, решение очень похоже :).

lissettdm 14.12.2020 19:39

Я проверю это завтра. Если это работает, это просто великолепно, и я очень ценю вашу помощь!!

k-wasilewski 14.12.2020 19:41

ОК, но я не вижу никаких проблем с переопределением функции интервала, потому что каждый раз, когда это свойство изменяется, компонент будет перерисовываться, и интервал может быть обновлен.

lissettdm 14.12.2020 19:44

Я получаю сообщение об ошибке: «Невозможно назначить «текущему», поскольку это свойство доступно только для чтения».

k-wasilewski 14.12.2020 19:54

Хорошо, теперь это работает :) Я не мог сделать то, что вы предложили, так как я просто проверяю это значение в каком-то совершенно другом компоненте. Интервал должен быть фиксированным. Еще раз большое спасибо, это была блестящая идея!

k-wasilewski 14.12.2020 19:59

Как пробовал с состоянием, не сработало. Пробовал с неизменяемым js, не работает. Пробовал с редуксом не получилось. Серьезно реагирующие функциональные компоненты имеют некоторые проблемы с рендерингом. Ваше решение сработало, братан. Спасибо.

Berke 27.08.2021 16:22

Другие вопросы по теме