响应式选项
大多数选项接受值、ref 或 getter,并在需要时读取:变化最迟在下一次拖拽时生效。表格中把它们标记为 值 · ref · getter。
值、getter 或任何 ref(可写、浅层、computed、只读——例如来自 useTemplateRef 的),库只会读取它。与 Vue 的 MaybeRefOrGetter 不同,在需要 string | number 的地方它接受 Ref<string>。
type MaybeReadonlyRefOrGetter = T | Readonly<Ref<T>> | (() => T)值或任何 ref,用于函数本身就是一种值的选项(浮层组件、accept 规则、自定义动画),因此无法区分 getter。把组件放在 shallowRef(或 computed)中:Vue 不能把它们变成响应式的。
type MaybeReadonlyRef = T | Readonly<Ref<T>>元素
组合式函数作用的元素(makeDraggable(target)):元素本身、模板引用(useTemplateRef)或 getter。它可以变化(v-if):本库会跟随它。
type MaybeElementRef = MaybeReadonlyRefOrGetter<MaybeElement>元素:HTML 或 SVG 元素,或组件实例(它的根元素 $el),就像模板引用给出的那样。还没有元素(尚未挂载)时为 null 或 undefined。
type MaybeElement = | HTMLElement | SVGElement | ComponentRef | null | undefinedKey 与几何
id 或 key:可拖拽元素、放置目标、列表或列表项的。
type Key = string | number一个盒子,单位 px,使用视口坐标,与 getBoundingClientRect() 给出的一致。
状态
provider 当前在做什么:
'idle':什么都没做;'activating':按下正在等待满足激活约束(一段距离、一次长按);'dragging':拖拽进行中;'dropping':放置正在确定中(异步的onBeforeDrop),或浮层仍在落位;'selecting':选择区域正在画选框。
type DnDStatus = | 'idle' | 'activating' | 'dragging' | 'dropping' | 'selecting'拖拽如何移动,无论由哪个传感器驱动(SensorActivation.type):'pointer' 跟随坐标点,'keyboard' 按项移动。
type SensorType = 'pointer' | 'keyboard'按下的指针类型(PointerEvent.pointerType):激活按类型设置。
type PointerKind = 'mouse' | 'touch' | 'pen'一个值,或该值的 promise:可能是异步的钩子所返回的(onBeforeDrop)。
type MaybePromise = T | Promise<T>