常用的vue动画组件库

animate.style是一个常用的动画组件库，非常适合强调、主页、滑块和引导注意力的提示

1，安装

使用 npm 安装：

$ npm install animate.css --save

导入到main文件夹中：

import 'animate.css';

其他的安装方法官网也有

​​​​​​动画.css |CSS 动画的跨浏览器库。 (animate.style)

2，用法

将类和动画名称直接添加到元素中

<h1 class="animate__animated animate__bounce">An animated element</h1>

3，自定义属性

还可以用自定义属性来控制动画的持续时间、延迟和迭代

除了动画效果，通常我们还有一些别的需求。比如动画循环执行、动画延时执行、动画执行时长。这些设置，Animate.css都给我们实现了。同样也只需配置几个类名，完全不用JS控制。

延迟执行：

• animate__delay-2s	2s
  animate__delay-3s	3s
  animate__delay-4s	4s
  animate__delay-5s	5s

 执行时长：

animate__slow	2s
animate__slower	3s
animate__fast	800ms
animate__faster	500ms

迭代次数：

animate__repeat-1    1
animate__repeat-2    2
animate__repeat-3    3
animate__infinite    infinite