只要在全局入口使用一次,不用再单独处理某个点击事件的防抖
// useDebounceEverywhere by RichDaddyCashMany
import { useLayoutEffect } from 'react'
export const useDebounceEverywhere = (delay = 300) => {
useLayoutEffect(() => {
const onClick = e => {
let element = e.target
element.style.pointerEvents = 'none'
let currentElement = element
while (currentElement.parentElement) {
currentElement.parentElement.style.pointerEvents = 'none'
currentElement = currentElement.parentElement
}
setTimeout(() => {
element.style.pointerEvents = ''
let currentElement = element
while (currentElement.parentElement) {
currentElement.parentElement.style.pointerEvents = ''
currentElement = currentElement.parentElement
}
}, delay)
}
document.addEventListener('click', onClick)
return () => {
document.removeEventListener('click', onClick)
}
}, [])
}