您现在的位置是: 首页 > 前端开发 Vue 路由跳转后不在顶部

Vue 路由跳转后不在顶部

2020-09-03 前端开发 163人已围观 181次浏览

简介Vue 路由跳转后不在顶部

Vue 项目中,在很长的页面中,使用下面代码

this.$router.push('/post/1')

进行路由跳转时,就会出现滚动条还是在当前位置,跳转的目标页并没有在顶部的问题,这样会对于很多长页面来说,是很困扰的

比较简单的解决方法就就是在 Vue 项目的 main.js 中添加下面的代码

// 处理页面跳转后不在顶部问题
router.afterEach((to, from, next) => {
  window.scrollTo(0, 0)
})

具体位置可以是在 new Vue({ 之前即可,放在文件最后可能会出现不生效的问题

保存之后,再点击跳转,就会默认跳转目标页顶部

很赞哦! (0)

随机好物推荐

站长推荐

站点信息

  • 网站地图