Vue.Draggable
Vue.Draggable copied to clipboard
Dragged element gets stuck when different draggable is destroyed
Reproduction
https://codesandbox.io/s/gracious-shamir-djq5iw?file=/src/App.vue

Scenario
Vue.Draggable's normal behavior clears the Sortable (including the currently dragged element) before the draggable element is destroyed. If the dragged Element is from the draggable that is being destroyed, everything works as intended. Sortable is cleared and the other draggables continue to work. However if the dragged Element is from another draggable, it gets stuck mid drag.
See attached GIF and code at https://codesandbox.io/s/gracious-shamir-djq5iw?file=/src/App.vue.
Steps to Reproduce
- Start dragging an element from the first draggable
- Wait 4 seconds until second draggable is destroyed
Describe the bug
Dragged element gets stuck mid drag when different draggable is destroyed.
Expected Behavior
Dragged element should be unbothered if it is from another draggable.
Actual Solution
I played around in the Sortablejs destroy method which is called from vue draggable which fixed this bug.
current destroy:
destroy: function destroy() {
...
this._onDrop();
...
},
updated destroy:
destroy: function destroy() {
...
if (el === rootEl) this._onDrop();
...
},
Version
| package | version |
|---|---|
| sortablejs | 1.10.2 |
| vuedraggable | ^2.24.3 |