transitionpropsname：-字符串，用于自动生成CSS过渡类名。例如：name:'fade'会自动扩展为.fade-enter、.fade-enter-active等。默认类名是"v"appear:-boolean，是否在初始渲染时使用过渡。默认为假。css:-布尔值，是否使用CSS过渡类。默认为真。如果设置为false，注册的JavaScript钩子将仅通过组件事件触发。type:-字符串，指定过渡事件的类型，并在过渡结束时监听。有效值为“transition”和“animation”。默认情况下，Vue.js会自动检测持续时间长的过渡事件类型。mode:-字符串，控制退出/进入的转换时间顺序。有效模式是“out-in”和“in-out”；默认是两者。输入类：-stringleave-class：-stringappear-class：-stringenter-to-class：-stringleave-to-class：-stringappear-to-class：-stringenter-active-class：-stringleave-active-class：-stringappear-active-class:-stringeventbefore-enterbefore-leavebefore-appearenterleaveappearafrt-enterafter-leaveafter-appearenter-cancelledleave-cancelled(v-showvalid)appear-cancelled六个过渡类名简单来说active会伴随enter/leave整个过程中v-enter和v-leave只存在一帧，所以肉眼看v-enter-to和v-enter-active几乎同时出现和消失。所以你会经常看到一些写的一样的动画效果却不完全一样：（这是我之前有疑惑的地方）1..fade-enter-active,.fade-leave-active{transition:opacity.5s;}.fade-enter,.fade-leave-to{不透明度:0;}2,.fade-enter-active,.fade-leave-active{transition:opacity.5s;}.fade-enter,.fade-leave-active{opacity:0;}单分量过度hello
.fade-enter-active,.fade-leave-active{transition:opacity.5s;}.fade-enter,.fade-leave-to{opacity:0;}和animation类似，只需要在transition类中填写animation.fade-enter-active,.fade-leave-active{animation:fade-in.5s;}.fade-enter,.fade-leave-to{animation:fade-in.5sreverse;}@keyframesbounce-in{0%{ooacity:0;}50%{ooacity:.5;}100%{ooacity:1;}}自定义转场类名Vue也支持单独添加自定义转场类名，可以方便的配合第三方动画库enter-classenter-active-classenter-to-class(2.1.8+)leave-classleave-active-classleave-to-class(2.1.8+)JavaScript钩子
方法：{beforeEnter:function(el){el.style.opacity=0;//el:执行当前actiondom元素},//只使用JavaScript进行transition时，在enter和leave中，回调函数done是必须的，否则会同步调用，立即完成transition。enter:function(el,done){//...done()},afterEnter:function(el){//...},enterCancelled:function(el){//...},beforeLeave:函数(el){//...},leave:function(el,done){//...done()},afterLeave:function(el){//...},//只使用leaveCancelledleaveCancelledinv-show:function(el){//...}}listexcessivelistoverusecomponent,andneedtobinduniquekeyv-movefeatureVue使用一个名为FLIP的简单动画队列，使用转换来平滑地将元素从其先前位置过渡到新位置。*v-move是在transition开始时判断元素的位置是否发生了变化，key是标识每个元素的key。在v-for中使用索引绑定键值是不行的，但是不会触发v-move的效果，因为不管数据怎么变化，数组下标是不变的。*一定要在transition开始时改变元素的位置：v-enter或者v-leave或者activestage，但是v-leave-to和v-enter-to看不到下面的demo，因为是只是一组垂直排列lisoposition:absolute将腾出空间，然后li将向上移动。{{item.text}}.slide-move{/*v-move*/trsnsition:all.5s;}。slide-leave-active{/*不触发v-move效果*/transform:translate3d(-100%,0,0);}.slide-leave-active{/*触发了v-move效果，因为是absolute所以在他之后，li向上移动，position改变*/position:absolute;转换：translate3d(-100%,0,0);}slide-leave-to{/*不触发v-move效果，仅在transition开始时才改变positionvalid*/position:absolute;转换：translate3d(-100%,0,0);}
