现在,在我的 Vue 应用程序中,当我单击<router-link>
,它会转到该页面,但滚动级别与上一页相同(因为链接只是替换了组件)。
我想知道是否有一个vue-router
使页面转到顶部的功能,或者我需要使用其他一些 JS 编程来实现此目的。
非常感谢您的帮助。
Vue 路由器有几个守卫和函数,在路由更改之前、期间和之后调用。在您的情况下,有一个专用函数可以让您覆盖滚动的默认行为,名为scrollBehavior https://router.vuejs.org/guide/advanced/scroll-behavior.html#async-scrolling。它被称为有两个路由对象 https://router.vuejs.org/api/#the-route-object和一个包含 x 和 y 坐标的对象,可能还有一个选择器,用于选择页面上的元素用作偏移量。
要使用它,请更改定义路由器的代码并添加scrollBehavior
功能:
// src/router.js
const router = new VueRouter({
// What you previously had here, such as routes
scrollBehavior (to, from, savedPosition) {
return { x: 0, y: 0 };
}
});
export default router;
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)