mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-24 23:01:57 +08:00
docs(reorder): Update incomplete reorder docs (#17417)
* add base reorder doc updates * update doc wording * remove extra sentence * clear up explanation sentence * fix typo * run build * fix doc definition for ionitemReorder * make requested changes * remove prop table
This commit is contained in:
2
core/src/components.d.ts
vendored
2
core/src/components.d.ts
vendored
@ -3510,7 +3510,7 @@ export namespace Components {
|
||||
*/
|
||||
'disabled'?: boolean;
|
||||
/**
|
||||
* Event that needs to be listen to in order to respond to reorder action. `ion-reorder-group` uses this event to delegate to the user the reordering of data array. The complete() method exposed as
|
||||
* 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.
|
||||
*/
|
||||
'onIonItemReorder'?: (event: CustomEvent<ItemReorderEventDetail>) => void;
|
||||
}
|
||||
|
@ -13,7 +13,7 @@ reorderGroup.addEventListener('ionItemReorder', (ev) => {
|
||||
});
|
||||
```
|
||||
|
||||
The event's detail includes all the relevant information about the reorder operation, including the `from` and `to` indexes. The meaning of this indexes are pretty self-explanatory, the item **from** index X, moved **to** the index Y.
|
||||
The event's detail includes all the relevant information about the reorder operation, including the `from` and `to` indexes. In the context of reordering, an item moves `from` index X `to` index Y.
|
||||
|
||||
For example, in this list we move the item at index `0` to the index `3`:
|
||||
|
||||
@ -42,10 +42,6 @@ Fortunately this `complete()` method can optionally accept an array as input and
|
||||
this.dataList = reorderGroup.complete(this.dataList);
|
||||
```
|
||||
|
||||
This utility is really handy when
|
||||
|
||||
|
||||
|
||||
<!-- Auto Generated Below -->
|
||||
|
||||
|
||||
@ -178,9 +174,9 @@ reorderGroup.addEventListener('ionItemReorder', ({detail}) => {
|
||||
|
||||
## Events
|
||||
|
||||
| Event | Description | Type |
|
||||
| ---------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------- |
|
||||
| `ionItemReorder` | Event that needs to be listen to in order to respond to reorder action. `ion-reorder-group` uses this event to delegate to the user the reordering of data array. The complete() method exposed as | `CustomEvent<ItemReorderEventDetail>` |
|
||||
| Event | Description | Type |
|
||||
| ---------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------- |
|
||||
| `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. | `CustomEvent<ItemReorderEventDetail>` |
|
||||
|
||||
|
||||
## Methods
|
||||
|
@ -50,11 +50,9 @@ export class ReorderGroup implements ComponentInterface {
|
||||
}
|
||||
|
||||
/**
|
||||
* Event that needs to be listen to in order to respond to reorder action.
|
||||
* `ion-reorder-group` uses this event to delegate to the user the reordering of data array.
|
||||
*
|
||||
*
|
||||
* The complete() method exposed as
|
||||
* 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.
|
||||
*/
|
||||
@Event() ionItemReorder!: EventEmitter<ItemReorderEventDetail>;
|
||||
|
||||
|
@ -2,7 +2,7 @@
|
||||
|
||||
Reorder is a component that allows an item to be dragged to change its order. It must be used within an `ion-reorder-group` to provide a visual drag and drop interface.
|
||||
|
||||
`ion-reorder` is the anchor users will use to drag and drop items inside the `ion-reorder-group`. It must be added to `ion-item` in order for them to be draggable.
|
||||
`ion-reorder` is the anchor users will use to drag and drop items inside the `ion-reorder-group`.
|
||||
|
||||
```html
|
||||
<ion-item>
|
||||
@ -13,9 +13,6 @@ Reorder is a component that allows an item to be dragged to change its order. It
|
||||
</ion-item>
|
||||
```
|
||||
|
||||
The position of the
|
||||
|
||||
|
||||
<!-- Auto Generated Below -->
|
||||
|
||||
|
||||
|
Reference in New Issue
Block a user