Does Ionic 5 has swipe events?

Viewed 4877

I have an Ionic page on which I'd like to be redirected to a custom page when swiping left. Just redirecting me back isn't good enough, since I can have that page open from a deep link, meaning I have no back on my window's history.

I saw that there's a gesture API, but it's a bit too much for such a common cause. Also, I saw that on previous versions there where swipe left/right events, but no reference for it on Ionic 4/5.

Doesn't Ionic 5 has an on-swipe-left event?

2 Answers

Another solution, if you didn't want to add a hammerjs dependency and just use Ionic would be to use the official ion-slides component to manage your pages as slides.

I've implemented this on a couple of apps and it works really well.

In your example, you would want to setup an <ion-slides> container and then your 'pages' would exist inside as <ion-slide> components.

You can then easily tap into the (ionSlideDidChange) event as follows:

  <ion-slides
    *ngIf="!isLoading && pages"
    [options]="slideOptions"
    (ionSlideDidChange)="onSlideChange()"
    class="em-height-full"
    #pages
  >

Then in your .js or .ts file just create a method like:

async onSlideChange() {
    this.pageIndex = await this.slides.getActiveIndex();
  }

Then you could track the page with pageIndex. So in your case, you'd open the page from the deepLink (maybe have it route to 'page 2') and then when you swipe left on the slide component you could go to page 1.

Related