| 事件名 | 说明 | 回调签名 |
|---|---|---|
| onChoose | 元素被选中 | ((event: DraggableEvent) => void) |
| onUnchoose | 元素取消选中 | ((event: DraggableEvent) => void) |
| onStart | 元素开始拖拽 | ((event: DraggableEvent) => void) |
| onEnd | 元素取消拖拽 | ((event: DraggableEvent) => void) |
| onAdd | 元素从一个列表拖拽到另一个列表 | ((event: DraggableEvent) => void) |
| onUpdate | 元素顺序更新时触发 | ((event: DraggableEvent) => void) |
| onSort | 列表的任何更改都会触发 | ((event: DraggableEvent) => void) |
| onRemove | 元素从列表中移除进入另一个列表 | ((event: DraggableEvent) => void) |
| onFilter | 试图拖拽一个 filtered 的元素 | ((event: DraggableEvent) => void) |
| onMove | 拖拽移动的时候触发 | ((event: MoveEvent, originalEvent: Event) => void) |
| onClone | 克隆一个元素时触发 | ((event: DraggableEvent) => void) |
| onChange | 拖拽元素改变位置时触发 | ((event: DraggableEvent) => void) |
这里我们主要关注onChoose、onStart、onMove、onEnd和onUnchoose在开启“选中拖拽延时”下的触发顺序和表现。
长按达到设置时间后，触发
onChoose，随后需要移动一段微小的距离才会触发onStart，当拖动导致了元素顺序发送变化时触发onMove，松开触发onUnchoose随后紧跟onEnd是对应关系，如果长按触发了。onChoose和onUnchoose是对应关系，onStart和onEnd是对应关系，如果长按触发了onChoose但是没有移动微小的距离，就不会触发onStart，松开时也不会触发onEnd。给用户提示的dragging状态，应该在
onChoose和onUnchoose触发和修改，例如上图中的“长按排序”和“拖动排序”。
