Странное поведение пользовательской функции перетаскивания - PullRequest
0 голосов
/ 08 мая 2019

В настоящее время я создаю электронное приложение (Frontend в Vue), которое может запускать собственные операции перетаскивания. Эти операции ведут себя странно, если я запускаю их с помощью перетаскивания HTML5 (например, dragstart, dragstop и т. Д.). Поэтому я должен реализовать свой собственный обработчик перетаскивания, используя mouseup, mousedown и mousemove. Итак, в простой теории:

Если срабатывает MouseDown -> Установить флаг

Если активирован MouseUp -> Удалить флаг

Если MouseMove AND Flag -> checkCurrentPosition или initialPosition -> Сделать что-то

new Vue({
el: "#app",
  data: {
    mousedown: false
  },
  methods: {
    onMouseDown: function(e){
        console.log('mousedown');
        this.mousedown = true;
    },
    onMouseUp: function(e){
        console.log('mouseup');
        this.mousedown = false;
    },
    onMouseMove: function(e){
            if(this.mousedown) {
        console.log('mousedown && mousemove');
        console.log('clientX:', e.clientX);
        console.log('clientY:', e.clientY);
      }
    },
  }
})

Скрипка

если вы проверите этот пример, откройте консоль браузера и поэкспериментируйте с изображением (щелкните, перетащите и отпустите, ...), вы увидите, что при перетаскивании изображения-заполнителя запускается событие mousedown. и флаг установлен. Тогда я ожидал бы, что событие mousemove будет часто запускаться, но этого не происходит.

Обычно, если вы привязываете мышиное движение к какому-либо элементу Div, оно часто срабатывает, если вы наводите курсор мыши над ним, и вы можете получить фактическую позицию, например. Но это не происходит после mousedown.

ПРИМЕЧАНИЕ. Событие mouseup в Fiddle не привязано к Window, поэтому, если вы уроните элемент за пределы его области, событие mouseup не будет инициировано для элемента. Таким образом, флаг не удаляется, и тогда вы можете увидеть поведение, которое я ожидаю. событие mousemove часто срабатывает. Поэтому я думаю, что проблема в том, что при нажатии мыши событие перемещения мыши не запускается правильно.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...