0

我使用 ionic 5 作为框架。在我的一个页面中,我使用了具有离子手势功能的离子刷新器。现在,当我在没有离子刷新的情况下使用该页面时,我可以滑动离子内容内的离子项目。但是当我使用离子刷新时不可刷卡

customer-in-app-notification.html

    <ion-content>
  <ion-refresher slot="fixed" (ionRefresh)="doRefresh($event)">
    <ion-refresher-content>
    </ion-refresher-content>
  </ion-refresher>
  <ng-container *ngIf="notifications.length>0">
    <ion-list *ngFor="let list of notifications" swipeAll (swiperight)="removeNotification($event,list)">
      ...
    </ion-list>
  </ng-container>
</ion-content>

当我向右滑动时,它使用自定义创建的手势移动我的离子项目

ts文件

  swiperight() {
console.log('HEloo');
const listn = this.list.toArray();
for (const i of listn) {
  console.log(i);
  const gesture: Gesture = this.gestureCtrl.create(
    {
      el: i.nativeElement,
      gestureName: 'swipe right',
      onMove: (ev) => {
        console.log(ev);
        i.nativeElement.style.transform = `translateX(${ev.deltaX}px)`;
      },
      onEnd: (ev) => {
        if (ev.deltaX > 200 && ev.deltaX < 1000 && ev.velocityX > 0.1) {
          i.nativeElement.style.transition = '.2s ease-out';
          i.nativeElement.style.transform = `translateX(1000px)`;
        } else {
          i.nativeElement.style.transform = '';
        }
      }
    }, true);
  gesture.enable(true);
}

}

4

0 回答 0