Vue 提供了 transition 的封装组件，可以给任何元素和组件添加进入/离开过渡；我们可以结合animate.css来实现我们想要的效果。animate动画可实现的效果有很多，我们可以查看animate.css演示。

安装animate.css

npm install animate.css –-save

如果新版的animate不生效的话，可能是样式名变了，
需要得加上 animate__ 前缀才可以正常运行。
名称从animated fadeIn变为了 animate__animated animate__fadeIn ,将名称修改一下就可以了。

引用animate.css

import 'animate.css'

html代码

<transition enter-active-class="animated tada" leave-active-class="animated bounceOutRight" >
     <p v-if="show">hello word,I love China</p>
</transition>