進入/離開 時過渡的類名笋轨,有 6 個 class 切換
1.v-enter
定義進入過渡的開始狀態(tài)霎终,在元素被插入時生效钝的,在下一個幀移出
2.v-enter-active
定義過渡的狀態(tài)叹誉,在元素整個過渡中作用
3.v-enter-to
定義進入過渡的結束狀態(tài)糖埋,在元素被插入一幀后生效夏跷,此時刪除 v-enter
4.v-leave
定義離開過渡的開始狀態(tài)
5.v-leave-active
定義過渡的狀態(tài)哼转,在離開過渡被觸發(fā)后立即生效
6.v-leave-to
定義離開過渡的結束狀態(tài),在離開過渡被觸發(fā)一幀后失效槽华,此時刪除v-leave
1.html
<transition name="fade">
???? <p> hello </p>
</transition>
2.css
.fade-enter-active{
? ...................................
}
.fade-leave-active{
? ....................................
}
css 的類名為 <transition> 中的 “ name 屬性 - 過渡類名 ”構成壹蔓。