用 Promise 封装你的 CSS 动画

现实场景中,多个动画效果一般都会有先后关系,动画结束后也需要进行一些操作。若用 setTimeOut 方法,则不能保证计时器与动画结束事件同步。如果用事件监听,应对一些复杂的场景的话,写起来也比较麻烦。将 CSS 动画封装成 Promise 无疑是一个很好的方案。
通常的做法是:监听 animationend 事件,在其回调函数中执行 resolve 方法,改变 Promise 状态。
const onceAnimationEnd = (el, animation) => {
return new Promise(resolve => {
const onAnimationEndCb = () => {
el.removeEventListener('animationend', onAnimationEndCb)
resolve()
}
el.addEve

用 Promise 封装你的 CSS 动画最先出现在Python成神之路

版权声明:
作者:Mr李
链接:https://www.techfm.club/p/17952.html
来源:TechFM
文章版权归作者所有,未经允许请勿转载。

THE END
分享
二维码
< <上一篇
下一篇>>