vue3.2vuedraggable

xdm们，我用的是vuedraggable，vue3.2版本。我想不论拖拽到手机哪里都能自动吸附到手机顶部，有什么方法吗？现在只能吸附到指定位置。

在 VueDraggable 中，可以使用可拖放实例的 "sort" 事件来处理拖放元素吸附到手机顶部的逻辑。

下面是一个示例，已经在组件中使用了 VueDraggable：

<template>
  <div>
    <draggable @sort="handleSort" :list="phoneList" :options="draggableOptions">
      <div v-for="(item, index) in phoneList" :key="item.id">{{ item.name }}</div>
    </draggable>
  </div>
</template>

<script>
export default {
  data() {
    return {
      phoneList: [
        { id: 1, name: 'iPhone' },
        { id: 2, name: 'Samsung Galaxy' },
        { id: 3, name: 'Google Pixel' }
      ],
      draggableOptions: {
        group: 'phones'
      }
    }
  },
  methods: {
    handleSort(evt) {
      // 拖放元素被排序后触发的事件
      // 在此处编写吸附到手机顶部的逻辑
    }
  }
}
</script>

在 "handleSort" 方法中，可以使用事件对象 "evt" 中的数据来计算手机列表中拖放元素的新位置，并执行相应的操作以使其吸附到手机顶部。