Невозможно предотвратить дефолт внутри пассивного прослушивателя событий

Я использую список сортировки Framework7, и он работает хорошо, просто потому, что он не вызывает событие при изменении списка.

Итак, я пробую несколько встроенных событий:

$('.sortable-handler').on('touchstart', function (e) {
    e.preventDefault();
    alert('touchstart');
});

$('.sortable-handler').on('touchmove', function (e) {
    e.preventDefault();
    console.log('touchmove');
});

$('.sortable-handler').on('touchcancel', function (e) {
    e.preventDefault();
    console.log('touchcancel');
});

$('.sortable-handler').mouseleave(function (e) {
    e.preventDefault();
    console.log('mouseleave');
});

.. но все, что я получаю, это:

Невозможно предотвратить детекцию внутри пассивного прослушивателя событий из-за целевого считаются пассивными. Видеть https://www.chromestatus.com/features/5093566007214080

Какое событие я должен искать, чтобы получить обновленный список в каждом виде?

Ответ 1

Чтобы обрабатывать отсортированный список в Framework7, когда пользователь освобождает текущий элемент сортировки в новой позиции, вы можете использовать этот код:

  $$('li').on('sortable:sort',function(event){
    alert("From " + event.detail.startIndex + " to " + event.detail.newIndex);
  });

Fiddle: https://jsfiddle.net/0zf5w4y7/

Ответ 2

Смотрите этот блог. Если вы вызываете preventDefault на каждом touchstart, то у вас также должно быть правило CSS для отключения сенсорной прокрутки, например

.sortable-handler {
  touch-action: none;
}

Ответ 3

Для меня

document.addEventListener("mousewheel", this.mousewheel.bind(this), { passive: false });

сделал свое дело (часть { passive: false }).