Skip to content

Add native-like scroll behaviour when changing routes #1071

Closed
@dcastil

Description

@dcastil

Feature request

Currently the user stays at his current scroll position when the route is being changed. But when the user gets to a new page, he should see the top of the new page and when he goes back- and forward he should see the scroll position at which he left the page previously.

The logic on how the scroll position changes based on a route change should look like this:

  • New page → top scroll position
  • Already visited page → scroll position at which user previously left the page
  • Anchor change → scroll position at anchor

What problem does this feature solve?

  • The content of a page is ordered from top to bottom, so the top is what the user should see first when navigating to a page.
  • The user expects to be at the top of a page when the route changes, everything else can lead to confusion.

What does the proposed API look like?

The VuePress API doesn't change with this feature.

How should this be implemented in your opinion?

Vue Router provides a scrollBehavior API which can set the scroll position when changing routes. This could be implemented into the router initialisation in packages/@vuepress/core/lib/app/app.js.

The anchor scrolling doesn't need to be implemented as this is already solved, but maybe it's better to put everything into one place.

Are you willing to work on this yourself?

Yes, just want to check if this is desired.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions