vue动画库

自定义动画实现动画持续时间，延迟时间

<template>
  <div>
    <transition
    :duration="5000"
    
      enter-active-class="animate__animated animate__fadeInDown"
      leave-active-class="animate__animated animate__fadeOutUp"
      animate__delay-2s
    >
      <div class="box" v-if="a"></div>
    </transition>
    <button @click="a = !a">切换</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      a: false,
    };
  },
};
</script>
<style lang="less">
.box {
  width: 200px;
  height: 200px;
  background-color: orange;
}
</style>

自定义动画添加持续时间-- ：duration

<transition
      :duration="5000"
      enter-active-class="animate__ani