vue animatecss出现bug。应该是前一个元素还未消失，下一个元素动画已经开始渲染

Question

 <transition enter-active-class="animated zoomInLeft" leave-active-class="animated zoomOutRight">

       <start v-if="index === 0"/>

      </transition>

         <transition enter-active-class="animated zoomInLeft" leave-active-class="animated zoomOutRight">

       <detail v-if="index === 1"/>

      </transition>

       <transition enter-active-class="animated zoomInLeft" leave-active-class="animated zoomOutRight">

       <preview v-if="index === 2"/>

      </transition>

       <transition enter-active-class="animated zoomInLeft" leave-active-class="animated zoomOutRight">

       <end v-if="index === 3"/>

      </transition>