跳转滚动条置顶(总结)"/>
vue中页面跳转滚动条置顶(总结)
1.vue单个页面跳转时:
在此页面上mounted方法中设置滚动条的方法
mounted() {// 切换页面时滚动条自动滚动到顶部window.scrollTo(0,0);
}
2.全部页面,使用路由的钩子函数中设置(在router中main.js)
router.afterEach((to,from,next) => {window.scrollTo(0,0);// chromedocument.body.scrollTop = 0// firefoxdocument.documentElement.scrollTop = 0// safariwindow.pageYOffset = 0
});
//或
router.beforeEach((to, from, next) => { // chromedocument.body.scrollTop = 0// firefoxdocument.documentElement.scrollTop = 0// safariwindow.pageYOffset = 0next()
})
3.全部页面,使用路由vue-router自带的滚动条行为解决(router中的index.js文件中)
//页面跳转显示在顶部scrollBehavior (to, from, savedPosition) {if (savedPosition) {return savedPosition} else {return { x: 0, y: 0 }}}
更多推荐
vue中页面跳转滚动条置顶(总结)
发布评论