Vue最新防抖方案(必看篇)

  

当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次,如果设定的时间到来之前,又一次触发了事件,就重新开始延时。举个栗子,持续触发滚动事件时,并不执行处理函数,当1000毫秒内没有触发滚动事件时,才会延时触发滚动事件。

  

当持续触发事件时,保证一定时间段内只调用一次事件处理函数。节流通俗解释就比如我们水龙头放,水阀门一打开,水哗哗的往下流,秉着勤俭节约的优良传统美德,我们要把水龙头关小点,最好是如我们心意按照一定规律在某个时间间隔内一滴一滴的往下滴。举个栗子,持续触发滚动事件时,并不立即执行处理函数,每隔1000毫秒才会执行一次处理函数。

  

<>强防抖实例:

        & lt; script>   const延迟=(函数(){   让计时器=0   返回函数(回调,ms) {   clearTimeout(计时)   计时器=setTimeout(回调,ms)   }   })()   出口默认{   方法:{   fn () {   延迟(()=比;{//执行部分   }, 500)   }   }   }   & lt;/script>         

<强>节流实例:

        var节流=函数(函数,延迟){   var计时器=零;   返回函数(){   var=背景;   var args=参数;   如果计时器(!){   计时器=setTimeout(函数(){   函数。应用(上下文,args);   计时器=零;   },延迟);   }   }   }   函数处理(){   console.log (math . random ());   }   窗口。addEventListener(“滚动”,节流阀(处理,1000));      之前            

以上这篇Vue最新防抖方案(必看篇)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

Vue最新防抖方案(必看篇)