diff --git a/packages/nuxt/src/pages/runtime/router.options.ts b/packages/nuxt/src/pages/runtime/router.options.ts index 5f5405da3e..1a8875f3c2 100644 --- a/packages/nuxt/src/pages/runtime/router.options.ts +++ b/packages/nuxt/src/pages/runtime/router.options.ts @@ -12,6 +12,7 @@ type ScrollPosition = Awaited> export default { scrollBehavior (to, from, savedPosition) { const nuxtApp = useNuxtApp() + const behavior = this.scrollBehaviorType ?? 'auto' // By default when the returned position is falsy or an empty object, vue-router will retain the current scroll position // savedPosition is only available for popstate navigations (back button) @@ -28,7 +29,7 @@ export default { return { left: 0, top: 0 } } if (to.hash) { - return { el: to.hash, top: _getHashElementScrollMarginTop(to.hash) } + return { el: to.hash, top: _getHashElementScrollMarginTop(to.hash), behavior } } } @@ -39,7 +40,7 @@ export default { nuxtApp.hooks.hookOnce(hookToWait, async () => { await nextTick() if (to.hash) { - position = { el: to.hash, top: _getHashElementScrollMarginTop(to.hash) } + position = { el: to.hash, top: _getHashElementScrollMarginTop(to.hash), behavior } } resolve(position) }) diff --git a/packages/schema/src/types/router.ts b/packages/schema/src/types/router.ts index f47d18bf14..5d0f0ffe2c 100644 --- a/packages/schema/src/types/router.ts +++ b/packages/schema/src/types/router.ts @@ -5,6 +5,7 @@ export type RouterOptions = Partial> history?: (baseURL?: string) => RouterHistory routes?: (_routes: _RouterOptions['routes']) => _RouterOptions['routes'] hashMode?: boolean + scrollBehaviorType?: 'smooth' | 'auto' } export type RouterConfig = RouterOptions @@ -12,4 +13,4 @@ export type RouterConfig = RouterOptions /** * Only JSON serializable router options are configurable from nuxt config */ -export type RouterConfigSerializable = Pick +export type RouterConfigSerializable = Pick