ion-reorder-group
reorder groupは、reorder コンポーネントを使用したアイテムのコンテナです。ユーザがアイテムをドラッグして新しい位置にドロップすると、 ionItemReorder
イベントがディスパッチされる。このイベントのハンドラは complete
メソッドを呼び出すように実装する必要があります。
ionItemReorder
イベントの detail
プロパティには、from
と to
インデックスを含む、並べ替え操作に関するすべての関連情報が含まれます。並び替えのコンテキストでは、アイテムは from
インデックスから to
インデックスに移動します。reorder groupの使用例については、reorder のドキュメントを参照してください。
Interfaces
ItemReorderEventDetail
interface ItemReorderEventDetail {
from: number;
to: number;
complete: (data?: boolean | any[]) => any;
}
ItemReorderCustomEvent
必須ではありませんが、このコンポーネントから発行される Ionic イベントでより強く型付けを行うために、CustomEvent
インターフェースの代わりにこのインターフェースを使用することが可能です。
interface ItemReorderCustomEvent extends CustomEvent {
detail: ItemReorderEventDetail;
target: HTMLIonReorderGroupElement;
}
プロパティ
disabled
Description | If true , the reorder will be hidden. |
Attribute | disabled |
Type | boolean |
Default | true |
イベント
Name | Description |
---|---|
ionItemReorder | Event that needs to be listened to in order to complete the reorder action. Once the event has been emitted, the complete() method then needs to be called in order to finalize the reorder action. |
メソッド
complete
Description | Completes the reorder operation. Must be called by the ionItemReorder event.If a list of items is passed, the list will be reordered and returned in the proper order. If no parameters are passed or if true is passed in, the reorder will complete and the item will remain in the position it was dragged to. If false is passed, the reorder will complete and the item will bounce back to its original position. |
Signature | complete(listOrReorder?: boolean | any[]) => Promise<any> |
CSS Shadow Parts
No CSS shadow parts available for this component.
CSSカスタムプロパティ
No CSS custom properties available for this component.
Slots
No slots available for this component.