我正在尝试创建一些功能以允许用户滑动表格行以检查我数据库中的所述人员,我在使用滑动库时遇到了问题,因为我的导入出于某种未知原因被我的项目拒绝了.我决定尝试使用内置的 ontouchmove
函数做一些事情,但是每当我使用 ontouchmove
时,我的函数 checkedIn()
都会被反复触发, 有什么方法可以混合不同的 ontouchmove
, ontouchend
等函数每次滑动只执行一次?
这里是我目前的一些实现代码:
return (
(session) ?
<tr // eslint-disable-line jsx-a11y/no-static-element-interactions
key={booking.id}
onTouchMove={checkIn(booking.id)}
>
<td>{booking.type}</td>
<td>
{booking.sessionId ?
<span>
{(new Date(sessions[booking.sessionId].date)).toLocaleString('en-GB', {
day: '2-digit',
month: '2-digit',
year: 'numeric',
timeZone: 'utc',
})} {session.name}
</span> :
<span>No session</span> // eslint-disable-line react/jsx-indent
}
</td>
<td>
<div>{booking.consumerName}</div>
<div>{booking.consumerEmail}</div>
<div>{booking.consumerPhonenumber}</div>
</td>
最佳答案
一个可能的解决方法是简单地对正在调用的函数进行去抖动,您可以创建自己的去抖动函数或使用库中的函数,例如 lodash .
关于javascript - 使用 ontouchmove 只触发一次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53005252/