~~~ //css .animated{ transform-origin: left bottom; } .fade-enter,.fade-leave-to{ opacity: 0; } .fade-enter-active,.fade-leave-active{ transition: opacity 2s; } ~~~ ~~~ <transition name="fade" //定义动画的时长 :duration="2000" appear appear-active-class="animated swing " enter-active-class="animated bounce fade-enter-active" leave-active-class="animated swing fade-leave-active"> <div v-if="isShow">hello world</div> </transition> ~~~ ~~~ //表示入门动画执行5s,出场动画执行10s :duration="{enter:5000,leave:10000}" ~~~