Vue перетаскивание в Рекурсивный компонент и рекурсивное вложение

Question

Я работаю с Vue для создания рекурсивного компонента дерева, в настоящее время я добавил поддержку для флажков и расширения узлов, но у меня возникли некоторые проблемы с созданием перетаскивания в рекурсивном компоненте

Есть ли какие-либо способ реализовать перетаскивание с помощью этого примера:

Codesandbox Link

Я могу получить перетаскиваемый узел, но при отбрасывании я не получаю целевой узел? При остановке перетаскивания у меня только перетаскиваемый узел. Должен ли я добавить еще слушателей в места?

Здесь у меня только перетаскиваемый узел?

 handleDragEnd() {
          this.$el.classList.remove('cmp-drag-node');
      },

Примечание: Я не хочу, чтобы решение с VueDraggable Im ищет простое jsfiddle или какое-то разъяснение по вопросу, Vue перетаскиваемый не будет работать, так как мне нужно не только попасть в Node переупорядочить узлы

Answer 1

Итак, следующий кодекс прекрасно работает для меня. Управляется перетаскиванием с вложенным компонентом, но вам нужно изменить код.

Я использовал vuedraggable. Основным компонентом является Tree.vue, а узлы находятся в Treenode.vue. Иногда это клонирование узла, может быть, я что-то пропустил, но все остальное работает нормально.

Codepen - https://codesandbox.io/s/lingering-surf-ckv3y