VUE页面后退无刷新

231 阅读1分钟

离开当前页面时记录当前位置,使用sessionStorage存储数据(其中 wrapbox 当前滚动页面最外层的div ,ref=wrapbox)

beforeRouteLeave(to, from, next) {
	//记录离开时的位置__")
	sessionStorage.askPositon =
	this.$refs.wrapbox && this.$refs.wrapbox.scrollTop;
	if(to.name=='smission' ||to.name=='buyer'){
	sessionStorage.askPositon =''
	}//前进时无需记录位置,可以将数据置为空
	console.log("出去的位置")
	console.log(sessionStorage.askPositon)
	next();
},

进入页面后采用离开时的位置

beforeRouteEnter(to, from, next) {
console.log(sessionStorage.askPositon)
if (!sessionStorage.askPositon) {
//当前页面刷新不需要切换位置
sessionStorage.askPositon = "";
next();
} else {
next(vm => {
    if (vm && vm.$refs.wrapbox) {
            console.log("进来的位置")
            console.log(sessionStorage.askPositon);
        setTimeout(function() {
            vm.$nextTick(() => {
                vm.$refs.wrapbox.scrollTop=sessionStorage.askPositon
            });
        },80); //同步转异步操作
    }
   });
}
},