时间锁

时间锁修复bug

有时候2行代码能简单处理的问题就不用大费周章地瞎搞了

点击穿透

// 以下方法在 IOS 下无效，而且不建议用异步的定时器
const handleAddClick = () => {}
const handleTouchStart = () => {}
const handleTouchEnd = () => {}

useEffect(() => {
  setTimeout(() => btnAddRef.current.addEventListener('click', handleAddClick), 300)
  return () =>  btnAddRef.current.removeEventListener('click', handleAddClick)
})

<div onTouchStart={handleTouchStart} onTouchEnd={handleTouchEnd}>
  <div
    ref={btnRef}
    onClick={e => handleClick(e)}   
  >
  </div>
</div>

// 时间锁的解决方案
const [lockTime, setLockTime] = useState(0)

const handleAddClick = () => {
  const now = +new Date()
  if (now - lockTime < 300) {
    return
  }
}

const handleTouchStart = () => {
  setLockTime(+new Date())
}

多指触屏