Есть проблема, которая связана с восстановлением скролла.
Есть главная страница и там есть карточки товаров. Я нажимаю на карточку товара, которая расположена по центру страницы. Дальше перехожу на страницу именно товара и там есть кнопка "назад". Когда я кликаю на кнопку "назад" я хочу, чтобы при переходе назад, страница была уже по центру (или там, где распологается карточка товара, по которой я кликнул).
Сейчас использую в next.config.js:
scrollRestoration: true
Восстановление скролла действительно работает, только когда я кликаю назад или свайпаю именно от функционала браузера. Тогда да, все работает хорошо, но условный код:
router.push(appPathEnum.home, undefined, { scroll: false })
Не работает должным образом, хотя по документации scroll и должен отключать сценарий прокрутки вверх. Сейчас, он как раз таки и по клику на кнопку "назад" игнорирует позицию скролла, которую next записывает в sessionStorage.
Немного почитав документацию и проблемы в гите:
-
https://github.com/vercel/next.js/issues/57258
-
https://github.com/vercel/next.js/discussions/47781
Понял, что в документации описано неверно про scrollRestoration. и никакие флаги scroll: false не будут работать (будут работать, но исходя из нового положения скролла), так как при переходе через Link или router.push, Next будет записывать новое положение скролла
Получается, что сценарий такой.
- При клике на карточку товара где-то по центру экрана, все записывается в sessionStorage
- При клике на кнопку "назад" на карточке товара уже записывается новое положение скролла в sessionStorage
Возможно есть какие-то варианты отключения сохранения скролла? Можно конечно писать свои решения, но обычно всякие работы с скроллом ведут к каким-то интересным сайд-эффектам :(
P.S
router.back() работает хорошо, он по истории браузера возвращается назад, но это заведомо плохой вариант, так как если на странице карточки товара изменим язык или каким-то иным образом преобразим URL, то будет работать не правильно
