Почему touchmove не работает на html-холсте?

Question

Я использую угловое приложение, где пользователь имеет холст, и может рисовать прямоугольники на этом холсте.

Мое касание и касание стреляют, но touchmove нет. Я не уверен, что я не понимаю, как работает touchmove. Я предполагал, что это будет эквивалентно mousemove.

self.canvas.addEventListener('touchmove', (e) => { self.touchMove(e); }); 
    self.canvas.addEventListener('touchstart', (e) => { self.touchStart(e); }); // touch down event 
    self.canvas.addEventListener('touchend', (e) => { self.touchEnd(e); }); // 



    touchStart(e) { 
    e.preventDefault(); 
    const self = this; 
    const activeTag = self.TagService.activeTags[0]; 
    this.canvasState.doTouchStart(e, activeTag, (shape) => { 
     self.selection = shape; 
    }); 
    } 


    touchEnd(e) { 
    const self = this; 
    // console.log(this);//is the controller 
    const activeTag = self.TagService.activeTags[0]; 
    self.canvasState.doTouchEnd(e, activeTag, function doTouchUp(shape) { 
     self.selection = shape; 
     self.addShape(shape); 
     // console.log(self.shapes); 
    }); 
    } 

    touchmove(e) { 
    e.preventDefault(); 
    console.log("HERE HERE HERE"); 
    const self = this; 
    const activeTag = self.TagService.activeTags[0]; 
    this.canvasState.doTouchMove(e, activeTag, (shape) => { 
     let len = self.shapes.length; 
     self.addShape(shape); 
     let len2 = self.shapes.length; 
     if (len2 - len === 1) { 
     self.draw(); 
     self.shapes.splice(-1, 1); 
     } 
    }); 
    } 

Прикосновение и прикосновение к работе, но прикосновение к движению никогда не срабатывает. Я никогда не могу получить консольный вывод.

Редактировать: я изменил первую строчку, чтобы быть touchmove, так как там была сенсорная кнопка и touchmove (опечатка), но это все еще не срабатывает при касании. Кроме того, я получаю предупреждение Ignored attempt to cancel a touchstart event with cancelable=false, for example because scrolling is in progress and cannot be interrupted., когда пытаюсь что-то нарисовать. Это действительно странно, потому что я пробовал одно и то же в негласном приложении (очень простые взаимодействия с холстом), и я не получил эту ошибку. Он заблокировал меня от прокрутки и вместо этого нарисовал материал на холсте.

Answer 1

Если просмотреть код, при добавлении слушателя в этой строке:

self.canvas.addEventListener('touchmove', (e) => { self.touchMove(e); }); 

вы вызываете функцию self.touchMove(e) и более ниже в коде вы объявляя вашу функцию как touchmove(e), Вот отличная библиотека, которая помогает вам справляться с событиями касания. Hammerjs