Как подключиться к событию перетаскивания SortableJS

Question

Я пытаюсь подключиться к событию dragover / touchmove из библиотеки SortableJS (1.8.4).Элементы просто перетаскивают и меняют местами, но прослушивание этих событий не вызывает функцию обратного вызова, которую я им предоставил.

Сценарий использования заключается в том, что если перетаскиваемый объект находится за пределами swapThreshold, но над целью, он должен быть в состоянии упасть на цель без обмена местами с ним.Как только перетаскиваемый объект достигает значения swapThreshold, он должен поменяться местами, как обычно.

<draggable
    v-model="itemsArray"
<!-- invert-swap="true"      - this helps, but the elements don't swap until the 
                               draggable is almost off of the target completely -->
<!-- swap-threshold="0.5"    - changing this didn't help -->
<!-- dragover-bubble="true   - seems to have no effect -->
    @dragover="log"       <!-- log() is not being called -->
    @touchmove="log"      <!-- log() is not being called -->
    :move="log"           <!-- log() IS called for :move, and @start, @end, etc. -->
>
  <li v-for="item in itemsArray">{{item}}</li>
</draggable>

(комментарии приведены здесь только для ясности)

Я рассмотрел решение в moveсобытие, но оно вызывается только после того, как произошел обмен, или ненадежно, как указано в моем комментарии выше о свойстве invert-swap

Примечание: я использую Vue.Draggable (2.20), но это также должно применяться при использовании SortableJS напрямую

Answer 1

Используйте @ dragover = "log" @ touchmove = "log" в своей библиотеке, а не в перетаскиваемом компоненте.

Примерно так:

<li @dragover="log" @touchmove="log" v-for="item in itemsArray">{{item}}</li>