运用场景:在列表中选择项目跳转到下一个页面详情,重新返回这个页面的时候,需要滚动到之前的位置。
解决方法:
点击跳转的时候,把页面滚动的位置存在session里面,再次进来的时候,为容器赋值,,发现不管怎么设置
this.$refs.content.scrollTop的值都为0,后面f放在nextTick方法里面执行并放在mounted,发现当后端数据速度比较忙时,也会失效,因为数据是异步请求,真正获取数据不是在mounted。后面把nextTick放在数据请求成功后执行,成功解决问题,最终解决方案如下
methods: { //获取项目列表 getGamePlansList() { gamePlansBySportCode({ sportCode: this.queryData.sportCode, startDate: this.dateValue }).then(res => { this.$vux.loading.show() if(JSON.stringify(res.data) !== "{}") { this.project = res.data this.isData = true } else { this.isData = false } // 从详情回来的滚动条返回到上一次 this.$nextTick(() => { this.$vux.loading.hide() if(this.$utils.getSession('scrollTop')) { this.$refs.content.scrollBy(0, this.$utils.getSession('scrollTop')) } }) }) }