1.transition
需要進(jìn)行過渡/動(dòng)畫處理的元素，用<transition>標(biāo)簽嵌套晨汹，在css過渡和動(dòng)畫中自動(dòng)應(yīng)用相關(guān)的class類名。
過渡類名：
v-enter 進(jìn)行開始
v-enter-active 進(jìn)行中
v-enter-to 進(jìn)行結(jié)束
v-leave 離開開始
v-leave-active 離開中
v-leave-to 離開結(jié)束
v表示transition中的屬性name的值剥扣。
圖1.png
<div id="demo">
<button v-on:click="show = !show">
Toggle
</button>
<transition name="fade">
<p v-if="show">hello</p>
</transition>
</div>
<style scope>
.fade-enter-active, .fade-leave-active {
transition: opacity .5s;
}
.fade-enter, .fade-leave-to {
opacity: 0;
}
</style>
css動(dòng)畫和過渡的區(qū)別：
動(dòng)畫中 v-enter 類名在節(jié)點(diǎn)插入 DOM 后不會(huì)立即刪除铝穷，而是在 animationend 事件觸發(fā)時(shí)刪除。
