我使用 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);
}
}