vue跳转新页面每次页面都回到最顶部
Vue
2020-09-02 17:09:08
vue框架是目前应用极为广泛的一个前端框架,那么你在开发中是否发现这么一个现象,即:跳转页面每次跳转后页面并没有回到新页面的最顶部而是停留在当前位置,若我们在打开新页面后需要页面回转到最顶部要如何处理呢?
代码如下:
window.scrollTo(0,0)
个人将应用方法分为三种,分别是router、特定页面、公用方法
1、router中的应用:(每次跳转完成后就执行回到顶部操作,即应用所有跳转。)
router.afterEach((to,from,next)=>{
window.scrollTo(0,0)
})
2、特定页面的应用:(即如果我们只是需要在几个页面中回跳到顶部,那么只需要当页面加载完成后执行。)
mounted(){
window.scrollTo(0,0)
},
3、定义为公用方法,直接进行调用。
function scrollTOP(){
window.scrollTo(0,0)
}
以上便是个人总结的比较常规的三种使用场景,当然不同项目需求不同,你可以根据自己的实际需求来处理处符合你的东西。
六月初字帖坊小程序
你想要的字帖模板及工具,这里都有!
877篇文章
3117人已阅读