如何更改SweetAlert2的关闭动画？

Question

我正在将SweetAlert2 v8与animate.css一起使用以更改弹出动画。我正在使用的动画是fadeInRight。我还使用链式警报，并希望将关闭动画更改为fadeOutLeft，以使其在页面上滑动。

我添加animate.css类的方式是使用customClass弹出属性。

我尝试过：

• 使用onClose添加类
• 使用onOpen删除fadeIn类，然后使用onClose添加fadeOut类

这两种方法似乎都不起作用。如果有人知道如何更改结束动画，将不胜感激。

谢谢

Answer 1

red

Answer 2

从v9.0.0开始，有showClass和hideClass参数，文档在这里：https://sweetalert2.github.io#show-class

根据需要自定义打开/关闭动画，例如与Animate.css：

Swal.fire({
  icon: 'info',
  title: Swal.version,
  showClass: {
    popup: 'animated fadeInDown faster',
    icon: 'animated heartBeat delay-1s'
  },
  hideClass: {
    popup: 'animated fadeOutUp faster',
  }
})

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/animate.css@3/animate.min.css">