vue监听滚动事件，在指定位置显示隐藏div

1.监听滚动事件

在方法中添加一个方法

     btn_pos:function(){
      //滚动条的高度
      var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
      console.log(scrollTop)          
      //滚动条的高度>可视区的高度
    }

然后，在mounted钩子中，给window添加一个滚动监听事件

window.addEventListener('scroll',this.btn_pos); 

2.根据自己的需求，完善代码

btn_pos:function(){
      //滚动条的高度
      var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
      var clientHeight=document.documentElement.clientHeight;       
      console.log(clientHeight)
      //滚动条的高度>可视区的高度
      if(scrollTop>clientHeight){
        this.local = !this.local
      }else{  
        this.local = !this.local                        
      }
    }

3.

<button v-if="local" class="btn_run">返回</button>

4.

 data () {
    return {
      local:false
    }
  },

注意：如果离开该页面，就要移除这个监听事件，不然会报错

destroyed () { //离开这个界面之后，删除，不然会有问题
    window.removeEventListener('scroll', this.btn_pos)
  } 

转载于https://blog.csdn.net/weixin_42521965/article/details/80827482