在vue中使用防抖和节流,防止重复点击或重复上拉加载实例
作者:FiveBigNiu 时间:2024-05-22 10:28:01
废话不多说,直接上代码吧!
/**
* 函数防抖 (只执行最后一次点击)
* @param fn
* @param delay
* @returns {Function}
* @constructor
*/
export const Debounce = (fn, t) => {
let delay = t || 500;
let timer;
console.log(fn)
console.log(typeof fn)
return function () {
let args = arguments;
if(timer){
clearTimeout(timer);
}
timer = setTimeout(() => {
timer = null;
fn.apply(this, args);
}, delay);
}
};
/**
* 函数节流
* @param fn
* @param interval
* @returns {Function}
* @constructor
*/
export const Throttle = (fn, t) => {
let last;
let timer;
let interval = t || 500;
return function () {
let args = arguments;
let now = +new Date();
if (last && now - last < interval) {
clearTimeout(timer);
timer = setTimeout(() => {
last = now;
fn.apply(this, args);
}, interval);
} else {
last = now;
fn.apply(this, args);
}
}
};
用法
...
methods:{
getAliyunData:Throttle(function(){
...
},1000),
}
...
来源:https://blog.csdn.net/qq_34764577/article/details/82952368
标签:vue,防抖,节流,重复点击,上拉加载
0
投稿
猜你喜欢
Python实现读取文件夹按数字排序功能
2023-08-24 02:12:45
python flask项目打包成docker镜像发布的过程
2021-06-28 17:38:21
SQL Server中的SELECT会阻塞SELECT吗
2024-01-25 18:08:30
解决TensorFlow训练模型及保存数量限制的问题
2022-08-06 08:22:27
网站数据库,是选SQL Server还是Access好
2008-05-23 13:19:00
Python迭代用法实例教程
2021-07-18 13:00:45
各种鼠标经过图片边框加粗效果整理
2007-09-29 21:43:00
MySQL自定义函数和存储过程示例详解
2024-01-27 15:25:02
在Python中append以及extend返回None的例子
2021-05-12 10:33:34
SQL Server中带有OUTPUT子句的INSERT,DELETE,UPDATE应用
2024-01-14 02:58:03
Python open读写文件实现脚本
2022-08-23 00:26:46
Keras中的两种模型:Sequential和Model用法
2021-10-16 07:04:32
django创建自定义模板处理器的实例详解
2022-07-29 19:50:00
中文段首不需要空两格
2010-04-23 20:31:00
python3 最常用的三种装饰器语法汇总
2021-10-10 15:08:12
widows下安装pycurl并利用pycurl请求https地址的方法
2023-07-09 03:21:18
Python pip安装lxml出错的问题解决办法
2021-11-17 07:36:07
在PHP中使用redis
2024-05-13 09:22:41
深入解析JavaScript中的arguments对象
2024-05-09 14:50:44
python实现画桃心表白
2021-05-14 16:27:00