Draggable List

学生が再注文できるドラッグ可能な要素のリスト。

オプション

• data | array (required): idとtextキーを持つオブジェクトの配列. Default:none`.
• onChange | function: コールバックは、変更のたびに新しい順序のデータ配列で呼び出されます。. Default: onChange(){}.
• onInit | function: コンポーネント実装後に呼び出されるコールバック関数. Default: onInit(){}.
• shuffle | boolean: 初期表示時にデータ要素をシャッフルするかどうかを制御します。. Default: false.
• disabled | boolean: 要素をドラッグするかどうかを制御します。. Default: false.
• className | string: クラス名. Default: ''.
• style | object: CSSインラインスタイル. Default: {}.

例としては、以下のようなものがあります。

ライブエディター

<DraggableList data={[ { id: 0, text: "Compact" }, { id: 1, text: "Large" }, { id: 2, text: "Midsize" }, { id: 3, text: "Small" } ]} />

<DraggableList
    data={[
        { id: 0, text: "Compact" },
        { id: 1, text: "Large" },
        { id: 2, text: "Midsize" },
        { id: 3, text: "Small" }
    ]}
/>

結果

ReferenceError: Provider is not defined