antd官网推荐了几个 拖拽 工具类，dnd-kit ｜ react-beautiful-dnd ｜ react-dnd react-sortable-hoc ，拖拽实现方式好多种，下面我们使用 sortablejs 可快速简洁的实现拖拽。
下面是核心代码，其他省略。
// app.tsx
...
import { useRef } from 'react'
import Sortable, { SortableEvent } from 'sortablejs'
import arrayMove from 'array-move'
const App:FC = () => {
...
const Ref = useRef(null)
const handleSortEnd = useCallback((e: SortableEvent) => {
const { newIndex, oldIndex } = e
// 具体逻辑
...
}, [])
useEffect(() => {
setTimeout(() => {
new Sortable(SearchListRef.current!, {
group: 'search',
animation: 150,
handle: '.sort-handle',
onEnd: handleSortEnd //拖拽结束动作
})
}, 0);
}, [handleSortEnd])
return <div ref={Ref}>
<ul>
<li className='sort-handle'>xhh1</li>
<li className='sort-handle'>xhh2</li>
</ul>
</div>
}
