vue跳转新页面后回到顶部
程序员文章站
2022-05-14 09:28:34
...
第一种方法:main.js
router.afterEach((to,from,next) => {
window.scrollTo(0,0);
});
第二种方法:
在创建router实例时,做如下的配置
savedPosition当且仅当通过浏览器的前进/后退按钮触发时才可用
scrollBehavior(to, from, savedPosition) {
if (savedPosition) {
return savedPosition
}
return {x: 0, y: 0}
}
3
找到入口切换路由的页面App.vue文件下,添加watch事件,全局监听路由。
// 使用watch 监听$router的变化,
watch: {
'$route': function(to,from){
document.body.scrollTop = 0
document.documentElement.scrollTop = 0
}
}