iOS上的TouchMove事件

Question

我目前正在为iPad开发一个web应用程序。我有一个html画布，在那里我想要跟踪触摸移动事件的坐标。我可以跟踪touchstart事件，它输出我按下的坐标，但是当我在画布上移动时尝试输出当前坐标时，它什么也没有做，我有以下使用angular2的代码，其中this.currentArrowPoint是我在屏幕上输出值的标签：

e.preventDefault();
this.currentArrowPoint = ["a", "b"];
this.currentYPosition = ["e.changedTouches[0].pageY];
this.currentArrowPoint = [this.currentYPosition];

它肯定是进入了mousemove，因为我得到了a和b，但是当我输出任何与事件e相关的东西时，我绝对得不到任何输出，即使我尝试只输出e。这在除苹果设备之外的所有设备上都有效，所以我想知道我是不是错过了苹果浏览器或设备的一些特别之处？

谢谢

Answer 1

正如你可以读到的here，只有Chrome和火狐支持TouchEvent中的changedTouches，这意味着Safari不支持这一点。

我也猜你不是故意把e.changedTouches[0].pageY放在引号之间的吧？

你应该尝试根据他们在touchstart上的索引来跟踪触摸(为什么他们不把这个叫做touchdown，这是一种浪费……)并在touchmove上找出这些改动中是否有任何变化。您正在使用画布，所以我可以想象您正在尝试绘制一些东西。一旦你数到超过1次触摸，你就可以停止绘画。这样，你总是可以确定你是在跟踪右手指(或脚趾)。我不是在评判)

Answer 2

如果你想在带有3个事件监听器的iOS 13上做swipe或类似的事情，我找到了漫步解决方案。

const someFucntion = () =>{
   let touchstartX = 0;
   let touchendX = 0;

   const gesturedZone = this.mainWrapperRef.current; // ref, querySelector or something else
      gesturedZone.addEventListener('touchstart', (event) => {
         if (event.touches.length === 1) {
            touchstartX = event.touches[0].screenX;
         }
      }, false);
      gesturedZone.addEventListener('touchmove', (event) => {
         if (event.touches.length === 1) {
            touchendX = event.touches[0].screenX;
         }
      }, false);
      gesturedZone.addEventListener('touchend', () => {
         this.handleGesture(touchstartX, touchendX);
      }, false);
}
const handleGesture = (touchstartX, touchendX) => {
   // do some staff
};