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	Bubbles
ionItemReorder (deprecated)	Event that needs to be listened to in order to complete the reorder action. Deprecated — Use ionReorderEnd instead. If you are accessing event.detail.from or event.detail.to and relying on them being different you should now add checks as they are always emitted in ionReorderEnd, even when they are the same.	true
ionReorderEnd	Event that is emitted when the reorder gesture ends. The from and to properties are always available, regardless of if the reorder gesture moved the item. If the item did not change from its start position, the from and to properties will be the same. Once the event has been emitted, the complete() method then needs to be called in order to finalize the reorder action.	true
ionReorderMove	Event that is emitted as the reorder gesture moves.	true
ionReorderStart	Event that is emitted when the reorder gesture starts.	true

メソッド

complete

Description	Completes the reorder operation. Must be called by the ionReorderEnd 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>
Parameters	listOrReorder: A list of items to be sorted and returned in the new order or a boolean of whether or not the reorder should reposition the item.

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.