javascript - vue 2.0 transiton过渡效果异常
本文介绍了javascript - vue 2.0 transiton过渡效果异常的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
vue2.0上做切换过渡时,发现切换显示正常,切换消失时有延时没有过渡效果
<transition name='fade'>
<div v-show="isShow" class="detail" >
</div>
</transition>
.detail
position fixed
z-index 100
top 0
left 0
width 100%
height 100%
overflow auto
background rgba(7,17,27,.8)
&.fade-enter-active,&.fade-leave-active
transition opacity 3s
&.fade-enter,&fade-leave-active
opacity 0
解决方案
能用animate.css 就用, 不要自己去造轮子。 直接 <transition enter-active-class="animated fadeIn" leave-active-clss="animated fadeOut"></transition>
这篇关于javascript - vue 2.0 transiton过渡效果异常的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文