英文:
How to implement smooth scroll in a nuxt3 application
问题
我是nuxt3的新手，我无法弄清楚如何实现平滑滚动。我在~/app/中添加了一个`route.options.ts`文件并进行了测试，但没有成功。
这是我的`route.options.ts`文件：
```js
import type { RouterConfig } from '@nuxt/schema';
// https://router.vuejs.org/api/#routeroptions
export default <RouterConfig>{
scrollBehavior(to) {
return { el: to.hash };
},
};
这是我设置锚点链接的方式：
<NuxtLink :to="{path: '', hash: '#testimonials'}">Let's go!</NuxtLink>
英文:
I'm a rookie in nuxt3 and i can't figure out how to implement smooth scroll. I have added a route.options.ts file in ~/app/ and tested it out, but no success.
This is my route.options.ts file:
import type { RouterConfig } from '@nuxt/schema';
// https://router.vuejs.org/api/#routeroptions
export default <RouterConfig>{
scrollBehavior(to) {
return { el: to.hash };
},
};
And this is how I set the anchor links:
<NuxtLink :to="{path: '', hash: '#testimonials'}">Let's go!</NuxtLink>
答案1
得分: 1
在HTML的CSS中添加了css scroll-behavior: smooth; ，现在可以正常工作。
英文:
Added
scroll-behavior: smooth;
to html in css and now it works.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论