react中同一个点击事件中有两个事件,其中一个事件实现防抖?

如题目,我想实现一个input框的onClick功能,click事件中有两个事件,其中一个事件正常触发,另一个事件想做防抖.请问该怎么实现.

var timeout=null
dom.onclick = function () {
    //事件一
    console.log('事件一正常调用');
    //事件二 需要做防抖的
    if (timeout) {
        clearTimeout(timeout);
    }

    timeout = setTimeout(function (e) {
        console.log('处理事件二');
    }, 2000)
}

点击事件点一次事件一就会执行一次,然后事件二是二秒执行执行一次,就是说二秒内点在快,也只是执行一次

click事件里调用另一个事件不就好了

先去看看什么是防抖,看懂了就会了

// 正常事件1
function event1() {
    console.log('event1');
}
// 事件2
function event2() {
    console.log('event2');
}
// 将事件二改为加上防抖 // debounce 是你自己的防抖
const debounceEvent = _.debounce(event2, 1000)

// 点击事件
function onClick() {
    event1();
    debounceEvent();
}

 

function debounce(fn,delay){
	var timer=null;
	return function(){
		if(timer) clearTimeout(timer);
		timer=setTimeout(()=>{
			fn.apply(this,arguments);
			timer=null;
		},delay)
	}
}


dom.onclick = function () {
    console.log('事件一');
    debounce(()=>console.log('事件二'),2000)();
}

 

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

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

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