动画设置方法：
首先使用transition标签将要进行运动的内容包裹并为其命名：
<transition name="fade">
<p v-show="show">hello</p>
</transition>
然后在css中设置具体过渡效果：
.fade-enter-active, .fade-leave-active { //动画时间 transition: transform 1.5s } .fade-leave-active, .fade-enter { //动画具体运动 transform: translateX(300px); }
过渡的css类名
v-enter: 定义进入过渡的开始状态。在元素被插入时生效，在下一个帧移除。
v-enter-active: 定义进入过渡的结束状态。在元素被插入时生效，在 transition/animation 完成之后移除。
v-leave: 定义离开过渡的开始状态。在离开过渡被触发时生效，在下一个帧移除。
v-leave-active: 定义离开过渡的结束状态。在离开过渡被触发时生效，在 transition/animation 完成之后移除。
如果要使用外接的css动画库，如animate.css，可以通过在transition标签中添加属性来实现：
<transition name="fade"
enter-active-class="animated tada" //进入动画
leave-active-class="animated bounceOutRight"> //离开动画 <div id="div1" v-show="show"></div> </transition>
原文：http://www.cnblogs.com/goodxiao/p/6790562.html