Vue Draggable - Get access to the element you are dropping on

Question

I'm making a kanban board using Pivotal Tracker's API and building with Vue 2. I originally built this app with jQuery along with jQuery UI but now I'm rebuilding the app with Vue 2 and thought that Vue Draggable seems to be a good option to use for drag and drop.

In my app, when I drop a story card onto a category I need to be able to know which category I dropped on so I can send an update to Pivotal Tracker. My story-cards are stored as arrays in my Vue data objects as seen in this image: Vue data object (todos, backlog, inProgress, readyForReview, or data)

Currently I found a round about way to access the correct categories using the :move event with Vue Draggable. ```

<template>
  <div class="board">
    <p class="heading">{{text}}</p>
    <draggable :list="stories" class="draggable-list" :move="checkMove" :options="{group:'cards'}">
      <story-card v-for="(item, index) in stories" :story="item" :key="index"></story-card>
    </draggable>
  </div>
</template>

```

  methods: {
    checkMove (evt) {
      switch (evt.relatedContext.component._uid) {
        case 3:
          (evt.dragged._underlying_vm_.current_state = 'unstarted');
          break;
        case 5:
          (evt.dragged._underlying_vm_.current_state = 'unscheduled');
          break;
        case 7:
          (evt.dragged._underlying_vm_.current_state = 'started');
          break;
        case 9:
          (evt.dragged._underlying_vm_.current_state = 'finished');
          break;
        case 11:
          (evt.dragged._underlying_vm_.current_state = 'accepted');
          break;
      }
    }
  },

After digging for awhile I found that evt.relatedContext.component._uid returns a unique id for each array but the solution is very brittle because new ids are assigned each time I make a change and save the code. I'm under the impression that these properties that begin with an underscore should be avoided anyway as they are Vue's internal properties and I can't rely on them to stay the same.

The obvious solution after reading the Vue Draggable docs would be to use @end and evt.to but there's currently a bug where evt.from and evt.to both point to original element. (Link to issue) I need to get the element I'm dropping on or at least which array is being pushed to where the story card is being added on the drop. Any help to point me in the right direction for a less complicated, more reliable solution would be greatly appreciated!!