Javascript 在VueDraggable中，当我们将元素从一个数组拖放到另一个数组时，如何获取可拖动的元素数据？

我正在使用VueDragable，下面是一个阶段数组，当我们将一个故事从一个阶段移动到另一个阶段时，如何从事件中获取数据（在下面的阶段数组中描述）

const phases = [
  {
    pid: 'PH1',
    stories: [
      {
        sid: 'ST01',
        title: 'Story 1',
      },
      {
        sid: 'ST02',
        title: 'Story 2',
      },
    ],
  },
  {
    pid: 'PH2',
    stories: [
      {
        sid: 'ST11',
        title: 'Story 1',
      },
    ],
  },
];

假设我们将S01从第0个阶段索引（id:PH1）移动到第1个阶段索引（id:PH2）。 这样我就可以

• pid-从哪个元件移动（即PH1）
• 索引—从中移动的数组中的索引（即0）
• sid—正在移动的元素的id（即ST01）
• pid-移动到哪个元件（即PH2）
• index—它在其中移动的数组中的索引（即1）

我试过的

<draggable class="phase"
              group="containers"
              ghost-class="ghost"
              @end="checkEnd"
              v-model="phaseObj.stories"
              >
              <!-- :list="phaseObj.steps"> -->
      <!------------ STEP ---------------->
        <div v-for="step in phaseObj.stories"
              :key="step.stepId"/>
    </draggable>

checkEnd(evt) {
      // HERE I AM GETTNG newDraggableIndex, newIndex, oldDraggableIndex, oldIndex
      // BUT I NEED PID AND SID ALSO
      console.log(evt);
},