setInterval
то внутри increment запускаемый setInterval'ом
всегда имеет изначальное значение
Хотя оно уже должно инкрементиться
Странно очень...
let timer = null;
function Test()
{
const [count, setCount] = useState(0);
console.log('Здесь нормально, выходит 1 =>', count);
function increment()
{
console.log('А вот тут всегда 0 =>'+count);
setCount(count+1);
}
//конструктор, работает только один раз, так как в зависимость поставил нарочно пустой массив, чтоб много раз setInterval не создавать
useEffect(() => {
timer = setInterval(function(){
increment();
}, 1000);
}, []);
return count;
}
ReactDOM.render(
<Test />,
document.getElementById('root')
);
по вчерашнему я нашел ответ
Хотя в офиц доках странно что об этом не предупреждают
Функциональные и классовые компоненты реакта не идентичны
они имеют разницы
и одна большая разница которую я нашел и отняло два дня на понимание
отложенные вызванные функции "захватывают" "запоминают" те старые пропсы и стейты которые он имел на тот момент когда была вызвана отложенное исполнение setTimeout или setInterval
то же самое с классовым будет работать совершенно иначе
он будет забывать то состояние и пропсы когда был вызван setTimeout
он будет работать с самими последними свежими состяниями и пропсами
вот так.
очень странно конечно что в официальных доках Реакт не предупрждает об этом.
Ответ и разяснение нашел в хабрах
А вы знали об этом ??
это просто javascript. твое "захватывание" называется замыканием
https://en.reactjs.org/docs/hooks-faq.html#what-can-i-do-if-my-effect-dependencies-change-too-often Тут как раз про setInterval в useEffect
Привет в документации написано так Пул событий События SyntheticEvent содержатся в пуле. Это означает, что объект SyntheticEvent будет повторно использован, а все его свойства будут очищены после вызова обработчика события. Это необходимо из соображений производительности. Именно поэтому нельзя использовать синтетические события асинхронно Вообще не вкуриваю Что такое пулл что тут пытается сказать документация ?? Может простым крестянским языком обясните ??
читай на крестьянско-английском
типа после выполнения события очистится объект SyntheticEvent и если в асинхронной функции работать с SyntheticEvent то на момент выполнения может быть такое, что event уже будет очищен, например target, может затеряться
спасибо, что то начинаю понимать
и всё это потеряет смысл, когда перейдёшь на react@17
а что там будет? Не слежу чето)
ну почитай)
https://reactjs.org/blog/2020/08/10/react-v17-rc.html#no-event-pooling
Обсуждают сегодня