Question

我需要在加载时打开SweetAlert，执行JS函数“ myFunc（）”，然后关闭SweetAlert。

我在加载时调用SweetAlert：

Swal.fire ({
   title: 'Wait ...',
   onBeforeOpen: () => {
     Swal.showLoading ()
   }
})

我应该在代码的哪里放置myFunc（）？

Answer 1

我的想法是，实际上没有任何理由将您的函数包含在SweetAlertOptions对象中。由于您仅在执行函数时使用SweetAlert2来显示加载对话框，而没有从中获取任何用户输入，因此您可以按程序方式对其进行处理：

Swal.fire({
  title: 'Wait ...',
  onBeforeOpen () {
    Swal.showLoading ()
  },
  onAfterClose () {
    Swal.hideLoading()
  },
  allowOutsideClick: false,
  allowEscapeKey: false,
  allowEnterKey: false
})
myFunc()
Swal.close()

如果您使用的是async/await，请不要等待初始的Swal.fire()。无论如何，您都不在乎结果。如果myFunc()是异步的（为了在加载过程中不锁定UI线程，它应该是异步的），请等待它，然后关闭，或者以promise的分辨率关闭

await myFunc()
Swal.close()

OR

myFunc().then(result => {
  Swal.close()
})

或者，您可以在myFunc函数中调用Swal.close()和OnOpen：

Swal.fire({
  ...
  onOpen () {
    myFunc()
    Swal.close()
  }
  ...
})

Swal.fire({
  ...
  async onOpen () {
    await myFunc()
    Swal.close()
  },
  ...
})

Swal.fire({
  ...
  onOpen () {
    myFunc().then(result => {
      Swal.close()
    })
  }
  ...
})

SweetAlert2-从showLoading（）开始并在执行函数后关闭

1 个答案: