Я пытаюсь выполнить window.scrollTo при первом рендеринге, используя функцию useEffect. Я сохраняю позицию внутри localStorage, но она не работает.
Не работает на рендеринге первой страницы:
useEffect(() => {
window.scrollTo(0, localStorage.getItem('position'));
}, []);
Стоит отметить, что если я помещу функцию прокрутки внутрь функции и вызову ее через кнопку onClick, она сработает.
Это работает, если вызывается из onClick:
const setScroll = () => {
window.scrollTo(0, localStorage.getItem('position'));
}
Как я могу это решить?
Когда вызывается функция useEffect
, страница еще не отрисована. Попробуйте вызвать window.scrollTo
на следующем кадре:
useEffect(() => {
setTimeout(() => window.scrollTo(0, localStorage.getItem('position')), 0);
}, []);
Это помогло мне решить проблему! Единственная модификация, которую я сделал, - установить время ожидания более 100 мс. Спасибо!
Установлено ли какое-либо значение
localStorage.getItem('position')
? Должен ли он анализироваться в формате JSON? Что именно не работает? Пожалуйста, будьте более конкретными. Что/где это значение сохраняется в localStorage?