useDragLayer #

useDragLayer函数提供了一种将你的组件作为拖动层连接到 DnD 的方法。

<script setup lang="ts">
import { useDragLayer } from 'vue3-dnd'

const collectedProps = useDragLayer(monitor => ({ 
      item: monitor.getItem(),
    }))
</script>

<template>
  <div>...</div>
</template>
copy success
copy

参数 #

useDragLayer的参数是一个collect收集函数，它应该返回一个普通对象，并使你在组件中使用。

collect收集函数的参数是一个DragLayerMonitor对象，它提供了一些监视器的方法，以便你可以获取监视器的状态。collect函数的类型如下:

(monitor: DragLayerMonitor) => (void | object)
copy success
copy

返回值 #

useDragLayer返回一个Ref对象，它是collect函数的返回值。

• Collected Props - Ref<object>
  • 它是一个Ref对象，它的value指向collect函数的返回值。