Javascript 如何等待anime.js动画在单击按钮时完成？

我用

translateY

从0到400px改变

.text

位置的动画

动画从按钮开始，持续时间约为4000ms

问题是，每次单击按钮时，动画都会启动，即使最后一个动画尚未完成

每次动画开始时，它应该等待最后一个动画完成。但动画（仍在执行）需要完成更长的持续时间，因此下一个动画将开始。如果animejs支持的话，我不知道该怎么做

因为现在，每次我点击按钮，动画都会中断

如果不需要额外的全局变量就可以解决这个问题，那就太好了

函数向下（）{
动画({
目标：'.text'，
translateY:[0，'300px']，
持续时间：4000
});
}
document.getElementById（'btn'）。addEventListener（'click'，（）=>{
向下（）；
});
。换行文本{
高度：400px；
边框：1px纯红；
}
.文本{
文本对齐：居中；
边框：1px纯蓝色；
}

动漫文本
Lorem Ipsum只是一个虚拟文本
您可以尝试在动画期间禁用单击按钮：）我知道。但我不能。这只是一个事件的例子，这些事件不是通过点击而是通过定时器发生的。