vue.js中使用animate.css

1、安装

npm install animate.css --save

2、在main.js文件中引入

import animated from 'animate.css'

Vue.use(animated)

3、使用实例

（1）基础用法

    
An animated element

（2）@keyframes用法

.my-element {
  animation: bounce; /* referring directly to the animation's @keyframe declaration */
  animation-duration: 2s; /* don't forget to set a duration! */
}

（3）js用法

const element = document.querySelector('.my-element');
element.classList.add('animate__animated', 'animate__bounceOutLeft');

// 监听动画结束
element.addEventListener('animationend', () => {
  // do something
});

4、参考官网

https://animate.style/