js函数防抖debounce,vue自定义指令防抖
主要介绍了在Vue中使用debouce防抖功能，设置一个阈值来表示两次Ajax通信的最小间隔时间。如果在间隔中发生了新的keydown事件，Ajax通信将不会被触发，计时将重新开始。如果在发送数据之前，经过了指定的时间，并且没有新的keydown事件发生，这就是去抖防抖功能。
:
目录
1.防抖功能2。2.Vue中使用了debouce防抖功能。
1.防抖函数
假设Ajax通信之间的间隔不应该小于2500ms，上面的代码可以改写如下。
$(textarea )。on(keydown ，去抖(ajaxAction，2500))；
功能去抖(fn，延迟){
var timer=null//声明计时器
返回函数(){
var context=this
var args=参数；
clearTimeout(定时器)；
timer=setTimeout(function () {
fn.apply(上下文，参数)；
}，延迟)；
};
}
在上面的代码中，只要用户在2500ms内再次按键，就会取消上一个定时器，然后创建一个新的定时器。这确保了回调函数之间的调用间隔至少为2500毫秒。
2.Vue中使用debouce防抖函数
创建一个去抖动(图像稳定器)函数，该函数将在最后一次调用等待毫秒后调用func方法。去抖动(图像稳定器)函数提供了取消延迟函数调用的取消方法和立即调用的刷新方法。您可以提供一个options对象来确定如何调用func方法，而options.leading和 or options.trailing确定如何在延迟之前和之后触发。
(注意：是先打电话再等还是先等再打)。
当func调用时，将传入提供给图像稳定器函数的最后一个参数。随后的去抖动(图像稳定器)函数返回最后一次func调用的结果。
Lodash debouce参数：
Func(函数):需要图像稳定器的函数。
[wait=0] (number):延迟的毫秒数。
[options=] (Object): Options对象。
[options . leading=false](boolean):指定在延迟开始之前调用。
[options.maxWait] (number):设置func允许延迟的最大值。
[options . trailing=true](boolean):指定在延迟结束后调用。
模板
el输入
v-model=值
size=mini
Placeholder=请输入.
可清除的
@keydown.enter=handleSearch
/el-input
/模板
脚本
从“lodash”导入
导出默认值{
data() {
返回{值： }
},
创建(){
this.handleSearch=_。去抖(()={
//获取列表
this . getlist()；
}, 300);
},
销毁前(){
//取消该函数的图像稳定器调用
this . handlesearch . cancel()；
},
}
/脚本
关于如何在Vue中使用Debuce防抖功能的这篇文章到此为止。关于在Vue中使用Debuce防抖功能的更多信息，请搜索我们之前的文章或者继续浏览下面的相关文章。希望大家以后能多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。