首先,我遇到的问题是 无法保留(B)页面滚动的位置(scrollTop ) 无法赋值?!

黄色框是滚动部分(非最外层)

 

参考:https://www.csdn.net/tags/OtDakg2sOTA3NDktYmxvZwO0O0OO0O0O.html

看完我以为我写的没毛病,但是我没有使用$nextTick,setTimeout这两个方法,而是直接写里面的内容,造成无法给scrollTop赋值;

复制代码
beforeRouteEnter(to, from, next) {
        next((vm) => {
            if (from.name == "ComputerroomDetails") {
                vm.scrollIndex = sessionStorage.getItem("ScrollIndexPositionY");
                // vm.$el.scrollTop = Number(vm.scrollIndex);//$el这是获取外层元素
                // document.getElementsByClassName('content').scrollTop = Number(vm.scrollIndex);//一开始这么写但是无法赋值
                // document.querySelector('.content').scrollTop = Number(vm.scrollIndex);//同上
          // document.querySelector('.content').scrollTop = 100;
          vm.$nextTick(()=>{
              setTimeout(()
=>{
                let content
= vm.$el.querySelector('.content') ;
                content.scrollTop
= vm.scrollIndex; //这是获取到的滚动位置赋值
                console.log(
"scrollTop",content.scrollTop);
              },
100) })
            }
          }
) },
复制代码

差点就放弃这个方法了,看来还是得全套才行。感谢原作者,我就做个小笔记哈!

补充获取滚动位置的方法:

复制代码
 
html:
 <div class="content"  @scroll="scroll"></div>

methods:{
        // 滚动位置
        scroll(event) {
            this.scrollIndex = event.target.scrollTop;
            console.log('scroll', event.target.scrollTop)
        }
    }
复制代码

 

posted on   菜菜小江升级打怪之路  阅读(1578)  评论(0编辑  收藏  举报
努力加载评论中...
点击右上角即可分享
微信分享提示