Vue中使用animate

1.安装
        npm install animate.css
2.main.js中引用
        import animated from ‘animate.css’
        Vue.use(animated);
3.在页面中
（1）animate__animated必写
（2）animate__zoomIn也必须写，但是__后的值可以不同。不同的值代表不同的效果

<div class="text animate__animated animate__zoomIn">
      <div class="titleBox">
          <img src="../../assets/images/newListing/listing_lou1_l.png" />
      <div class="title">法律服务</div>
</div>

4.速度
（1）插件自带的

css名	时间
animate__slow	2s
animate__slower	3s
animate__fast	800ms
animate__faster	500ms

<div class="text animate__animated animate__zoomIn animate__slow">
   <div class="titleBox">
      <img src="../../assets/images/newListing/listing_lou1_l.png" />
      <div class="title">财务审计</div>
    </div>
</div>

（2）自定义的

  .text {
    --animate-duration: 5s;
  }

5.延迟时间
（1）插件自带的

class名	时间
animate__delay-2s	2s
animate__delay-3s	3s
animate__delay-4s	4s
animate__delay-5s	5s

(2)自定义的
问题：1.必须在类名为text的标签内添加 animate__delay-2s
           2.延迟时间为设置的时间再加2s。此例为:2+1 = 3s
该问题还没有找到方法解决。

  .text{
      --animate-delay: 1s;
  }