ionic 4/5 避免多个警报/弹出框/模态提示

Question

你知道如何避免多次提示警报/弹出框/模态吗？

我在 ionic4/5 中找不到任何示例。

private async alertCtrlDispatchNavigateAfterLogout(msg:string):Promise<HTMLIonAlertElement>{
  let alert = await this.alertCtrl.create({
    cssClass: "ge-session-timeout-alert",
    backdropDismiss: false,
    subHeader: msg,
    buttons: [
      {
        text: 'OK',
        role: 'cancel',
        handler: () => {
          this.store.dispatch(new RouterActions.NavigateAfterLogout(true));
        }
      }
    ],
  });
  await alert.present();
  return alert;
}

Answer 1

您可以参考下面用 ionic 3 编写的示例代码，同样的想法也适用于 Ionic 4/5，其中 alertPresented 标志防止出现多个实例

import { Injectable } from '@angular/core';

import { AlertController } from 'ionic-angular';

@Injectable()
export class Alert {
  public alertPresented: any;
  constructor(public alertCtrl: AlertController) {
    this.alertPresented = false
  }

  present(title, subTitle) {
    let vm = this
    if(!vm.alertPresented) {
      vm.alertPresented = true
      vm.alertCtrl.create({
        title: title,
        subTitle: subTitle,
        buttons: [{
          text: 'OK',
          handler: () => {
            vm.alertPresented = false
          }
        }],
      }).present();
    }
  }
}

Answer 2

您需要首先检查是否出现任何警报/弹出框/模态然后关闭

const checkPropmt = await this.alertCtrl.getTop();
if(checkPropmt){
  this.alertCtrl.dismiss();
}

上面的代码关闭警报或 model。