javascript - 使用 ontouchmove 只触发一次

Question

我正在尝试创建一些功能，以允许用户滑动表格行以检查我的数据库中的人，我在使用滑动库时遇到了麻烦，因为我的导入由于某种未知原因被我的项目拒绝。我决定尝试使用内置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>

标签： javascriptreactjs

Answer 1

一个可能的解决方法是简单地对被调用的函数进行去抖动，您可以创建自己的去抖动函数或使用库中的一个，例如lodash。