Блог

Я пытаюсь использовать scrollIntoView в приложении react, и поэтому на странице я использую это

 useEffect(() => {
  myRef.current.scrollIntoView({ behavior: 'smooth' });
}, [myRef, selectedSectionIndex, modalOpen]);
 

Это работает практически в любой ситуации, поскольку у меня есть ref={myRef} связанный с элементом элемент, который я хочу представить. Однако в одном из переходов, даже если код вызывается, он ничего не делает (даже не выдает ошибку). Только если я изменю его на

 useEffect(() => {
  setTimeout(() => myRef.current.scrollIntoView({ behavior: 'smooth' }), 0);
}, [myRef, selectedSectionIndex, modalOpen]);
 

Я читал о подобных проблемах, и именно поэтому я действительно попробовал это решение. Но я не могу толком понять, как это решает проблему. Я продолжаю читать, что элемент dom, на который ссылается ссылка, возможно, еще не отрисован при запуске первого кода, но

а. Почему это должно быть на втором? б. Поместив отладчик чуть выше этой строки, я вижу, что элемент присутствует в DOM и даже больше, если я выпущу отладчик, то же самое и молча ничего не делает, но если я перешагну и запущу эту строку, она фактически прокручивается.Редактировать: Я приложите скриншот отладчика, если я нажму f8, ничего, если я нажму f10, он прокручивается

Я хотел бы знать, что есть более чистый способ заставить это работать, но не могу его найти

Спасибо