drag and drop in ionic react code example

Example: ionic reorder

<!-- Default reorder icon, end aligned items -->
<ion-item>
  <ion-label>
    Item 1
  </ion-label>
  <ion-reorder slot="end"></ion-reorder>
</ion-item>

<ion-item>
  <ion-label>
    Item 2
  </ion-label>
  <ion-reorder slot="end"></ion-reorder>
</ion-item>

<!-- Default reorder icon, start aligned items -->
<ion-item>
  <ion-reorder slot="start"></ion-reorder>
  <ion-label>
    Item 3
  </ion-label>
</ion-item>

<ion-item>
  <ion-reorder slot="start"></ion-reorder>
  <ion-label>
    Item 4
  </ion-label>
</ion-item>

<!-- Custom reorder icon end items -->
<ion-item>
  <ion-label>
    Item 5
  </ion-label>
  <ion-reorder slot="end">
    <ion-icon name="pizza"></ion-icon>
  </ion-reorder>
</ion-item>

<ion-item>
  <ion-label>
    Item 6
  </ion-label>
  <ion-reorder slot="end">
    <ion-icon name="pizza"></ion-icon>
  </ion-reorder>
</ion-item>

<!-- Items wrapped in a reorder, entire item can be dragged -->
<ion-reorder>
  <ion-item>
    <ion-label>
      Item 7
    </ion-label>
  </ion-item>
</ion-reorder>

<ion-reorder>
  <ion-item>
    <ion-label>
      Item 8
    </ion-label>
  </ion-item>
</ion-reorder>