单击内部时，Sweetalert2 无法阻止吐司关闭

Question

我正在使用 Sweetalert2，但我无法成功阻止用户单击内部时 Sweet-alert toast 的关闭。我正在使用此 toast 功能来通知某个任务正在发生，我希望它在整个过程中保持打开状态。

话虽如此，现在当您点击 toast 的内部时，它会消失。当您单击它的外部时，它会保持打开状态，允许用户在应用程序中导航 （当然，只要它们不刷新即可。）

我在文档中没有看到任何内容或 GitHub 允许我在单击 toast 内部时阻止 toast 关闭的问题。

我在这里创建了一个 StackBlitz。 https://stackblitz.com/edit/angular-ivy-8zcvm6?file=src%2Fapp%2Fapp.component.html

有哪些解决方法或建议？

let toastr = Swal.fire({
  'imageUrl' : './assets/img/loading.svg',
  'imageWidth' : 100,
  'title' : 'Importing Files',
  'text' : 'Your import is running, keep working and we will let you know once it finishes.',
  'toast' : true,
  'position' : 'bottom-end',
  'showCancelButton' : false,
  'showConfirmButton' : false
});

Answer 1

使用解决方法，首先您必须存储对 toast 的引用，向其添加计时器并立即停止它（在 didOpen 函数内）：

persistentToast: any = null;

  openToast() {
    let toastr = Swal.fire({
      'title' : 'Importing Files',
      'text' : 'Your import is running, keep working and we will let you know once it finishes.',
      'toast' : true,
      'position' : 'bottom-end',
      'showCancelButton' : false,
      'showConfirmButton' : false,
      'timer': 500,
      'didOpen': () => {
        Swal.stopTimer();
      }
    });
    this.persistentToast = toastr;
  }

执行此操作后，单击 toast 时不会将其关闭。要关闭它，请添加一个您可以随时调用的函数：当您的任务完成或将其分配给按钮时单击：

closeToast() {
    if (this.persistentToast)
      this.persistentToast.close();
  }

单击内部时，Sweetalert2 无法阻止吐司关闭

Sweetalert2 unable to prevent a toast closing when clicked on the inside

angular

sweetalert2