vue控制滚动条位置

应用场景:滚动条复原、页面加载完成后滚动到指定位置 。

1.在router.js中添加如下代码

export default new Router({       
    routes:[],     
    scrollBehavior (to, from, savedPosition) {
      if(savedPosition){
        return savedPosition;
      }else{
        return { x: 0, y: 0 }
      }
    },
})

注:此方法打包后,如果以本地文件形式打开则会报错

2.在router.js或main.js中添加如下代码

router.afterEach((to,from,next) => {    
	document.title = to.matched[0].meta.title  // 可以更改组件页面的title标题,需要路由里有配置meta中的title
	window.scrollTo(0,0); 
	next();
});

注:以上两个方法都无法指定单个组件页面,所有页面都会生效,如有需要请使用缓存组件。

你可能感兴趣的:(Vue)