如何让vue监听滚动轴事件只执行一次?

如何让vue监听滚动轴事件只执行一次或者防止多次触发

 

    //在500毫秒内只触发一次scroll事件
    var timer;
    var flag = true;
    window.addEventListener('scroll', () => {
        if (flag) {
            this.handleScroll();
        }
        flag = false;
        clearTimeout(timer);
        timer = setTimeout(()=>{flag = true}, 500);
    }, true);

 

再滚动事件里加个标识判断一下

data(){
 return {
  flag=true;
 }
}



scroll(){
 //最上面
  if(this.flag==false){//说明已经运行过了
     return //或者 removeListener移除
  }
 //操作完之后最后
 this.flag=false;
}

 

用setTimeout延时执行下


    var timer,me=this;
    window.addEventListener('scroll', () => {
        clearTimeout(timer);
        setTimeout(() => { me.handleScroll() }, 300);
    }, true);

 

可以执行的同时移除监听

    window.addEventListener('scroll',()=>{
      this.handleScroll();
      window.removeEventListener('scroll');
    },true);

 

您好,我是有问必答小助手,您的问题已经有小伙伴解答了,您看下是否解决,可以追评进行沟通哦~

如果有您比较满意的答案 / 帮您提供解决思路的答案,可以点击【采纳】按钮,给回答的小伙伴一些鼓励哦~~

ps:问答VIP仅需29元,即可享受5次/月 有问必答服务,了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632