Vue+draggable实现图片拖拽排序

HTML代码：

<draggable v-model="mainImagelist" :move="onMove" @start="isDragging=true" @end="isDragging=false">
    <transition-group type="transition">
        <li v-for="item in mainImagelist" :key="item" class="item">
            <img :src="item" width="100%;" height="100%" />
        </li>
    </transition-group>
</draggable>

data数据：

export default {
    data(){
        return{
              mainImagelist: [],
          }
      }
}

js代码：

<script>
methods:{
      // 图片拖拽移动
    // 图片移动
    onMove({ relatedContext, draggedContext }) {
      const relatedElement = relatedContext.item;
      const draggedElement = draggedContext.item;
    }    
}
</script>