<ScrollRestoration />

One automatically handles resetting scroll position to the top when you navigate to a new page, as well as remembering your scroll position on each page you've visited and restoring that position when you navigate back or forward to it. This mimics the default behavior that browsers do with multi-page apps.

You can control this behavior by importing the ScrollRestoration component once in your app (we'd recommend doing so in your root _layout.tsx).

It accepts a disabled prop which takes values of type boolean or string "restore". If set to "restore," the scroll position will only reset to the top on new page navigation, but won't be restored to the previous scroll position when navigating back/forward.

In general, you shouldn't need to use this component, but it may be helpful in specialized use cases where you need more control over the scroll restoration logic.

Edit this page on GitHub.