2019-09-26 ios 详情页返回列表页 页面滑动底部 卡顿 scrollTop 不生效 为 0

注意:
html,head,body标签什么都没有样式


image.png

1.在index.html文件
最外层的是#app:样式


image.png
 #app{
        width: 100%;
        height: 100%;
        background-color: white;
        position: absolute;
        -webkit-overflow-scrolling: touch;
        /* overflow: auto; */ 整个项目页面千万不要有这个属性
      }

app下的子元素id='message'很高超出父元素app

image.png

第一步调试,先确定哪个能初始化 控制滚动
在app.vue文件中

mounted() {
     setTimeout(() => {
       $(window).scrollTop(500)
     }, 500);
  },

效果:页面能一刷新出来就滚动,就是实现的第一步
然后加监听函数:

window.addEventListener("scroll", this.ComputationalPages);

第二步:监听路由;离开记录位置,回来赋值位置
在app.vue文件中

watch: {
    $route(to, from) {
      //     setTimeout(() => {
      //   $("#app").scrollTop(500);
      // }, 1000);
      console.log(to.path);
      if (from.path == "/main") {
        this.scrollTop = $(window).scrollTop();
        console.log("444", this.scrollTop);
      }

      if (to.path == "/main") {
        console.log("66", this.scrollTop);

        setTimeout(() => {
          $(window).scrollTop(this.scrollTop);
        }, 10);
      }
    }
  },

备注:如果ios不生效;安装vconsole调试页面

你可能感兴趣的:(2019-09-26 ios 详情页返回列表页 页面滑动底部 卡顿 scrollTop 不生效 为 0)