跳到主要内容
版本:v7

ion-reorder-group

排序组是使用 reorder 组件的项目的容器。当用户拖动一个项目并将其放置到新位置时,会触发 ionItemReorder 事件。应为此事件实现一个处理程序,并调用 complete 方法。

ionItemReorder 事件的 detail 属性包含了有关排序操作的所有相关信息,包括 fromto 索引。在排序的上下文中,一个项目会从 from 索引移动到 to 索引。有关排序组的使用示例,请参阅 reorder 文档。

接口

ItemReorderEventDetail

interface ItemReorderEventDetail {
from: number;
to: number;
complete: (data?: boolean | any[]) => any;
}

ItemReorderCustomEvent

虽然不是必需的,但此接口可以替代 CustomEvent 接口,以便对此组件发出的 Ionic 事件进行更严格的类型检查。

interface ItemReorderCustomEvent extends CustomEvent {
detail: ItemReorderEventDetail;
target: HTMLIonReorderGroupElement;
}

属性

disabled

DescriptionIf true, the reorder will be hidden.
Attributedisabled
Typeboolean
Defaulttrue

事件

NameDescriptionBubbles
ionItemReorderEvent 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.true

方法

complete

DescriptionCompletes 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.
Signaturecomplete(listOrReorder?: boolean | any[]) => Promise<any>
ParameterslistOrReorder: 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.

插槽

No slots available for this component.