Как я могу вернуться в положение прокрутки на предыдущей странице, когда щелкнул обратно по компоненту AniLink в Gatsby JS? - PullRequest
0 голосов
/ 23 апреля 2020

Описание:

У меня есть страница портфолио в Гэтсби JS 2.4.2 с длинным списком проектов.

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

Но когда он щелкает по обратной ссылке на этой новой странице (которая является AniLink-Component ), он направляется обратно к началу предыдущей страницы. Такое поведение нежелательно, поскольку пользователь должен снова прокрутить вниз, чтобы добраться до позиции, где он покинул страницу.

Ожидаемое поведение:

При нажатии на кнопку браузера в браузере (вместо упомянутой обратной ссылки) пользователь попадает в правильное положение. Но я хочу заархивировать это с помощью навигации по моей странице.

Как я могу заставить это работать?

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

Вот CodeSandbox с описанным выше поведением

И изображение, описывающее, что Я хочу архивировать: desired behavior of issue

Вот изображение, описывающее, что на самом деле происходит: actual behavior of issue

Что я пробовал:

На GitHub возникает проблема при обновлении позиции прокрутки и решении с использованием новой preventScrollJump проп. Но при использовании этой опоры пользователь переводится в ту же позицию на новой странице, где он оставил предыдущую (например, пользователь ушел с y: -999 и перешел к y: -999 на новой странице). Использование preventScrollJump только для одной ссылки не решает проблему.

Вот CodeSandbox с этим поведением прыжка

И вот дополнительная картина, описывающая это: link click takes user to same position on new page

Этот CodeSandbox показывает нормальное, чистое HTML поведение и аналогично первому описанному .

...