//防抖 所谓防抖，就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。 //推荐使用
timeId = null;
debounce = (fn, time) => {
if (this.timeId) {
clearTimeout(this.timeId);
this.timeId = null;
}
this.timeId = setTimeout(fn, time);
};
handleChange = (value) => {
this.throttle(async () => {
// console.log(value);
let res = await searchGoods({
query: value,
});
// console.log(res);
this.setState({
goodsList: res.message || [],
});
}, 1000);
};
//节流 所谓节流，就是指连续触发事件但是在 n 秒中只执行一次函数
valid = true; // 标识上次事件是否已经完成
throttle = (fn, timeout) => {
// 上次事件已经执行完毕
if (this.valid) {
this.valid = false; // 设置定义器
setTimeout(()=> {
fn.call(this); // 执行回调函数
this.valid = true;
}, timeout);
}
};防抖和节流
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- 防抖 在n秒后执行，如果在n秒内触发，n就会重新计算， 在React项目中使用： src/@utils/debou...
- 防抖和节流的作用都是防止函数多次调用。防抖动和节流本质是不一样的。防抖动是将多次执行变为最后一次执行，节流是将多次...
- 5月以来，哪怕对市场风向再不敏感的人，也感觉到阵阵凉意。二级市场连续下挫，一级市场融资环境恶化，不论企业融资数量还...
