【React】ドラッグ&ドロップで並べ替えできるリストを実装する話ドラッグ状態で触れた要素のindexがそのまま移動先になると考えるのが1番簡単そうです。 やりたいこと これが検知できるのはonDragEnter,onDragOver,onDropということになります。 ただ、これだと末尾に移動させることができません。 なのでカーソルが触れている位置で移動先を変えることにします。 「上側 → index」「下側 → index + 1」 加えてゴースト(またはキャレット)の表示位置はドラッグ中に移動先が変わるたび更新しないといけないので、移動先の決定にはonDragOverを使用することになります。 ミニマムな実装 以上を踏まえてミニマムに実装したのがこちらです。(ゴーストなどは未実装) 補足 iOSのSafariではdraggable属性だけではなく、CSSで -webkit-user-darg: elementを付けていないとonDragStartが
