*本文只是將官網(wǎng)的內(nèi)容進(jìn)行簡單的整理救斑，可點(diǎn)擊查看實(shí)例查看官網(wǎng)具體描述及源碼實(shí)例泵琳。
當(dāng)從 DOM 中插入、更新或移除項(xiàng)目時舔涎，Vue 提供多種應(yīng)用過渡效果的方式笼踩。具體可以分為以下三類：單元素/組件件的過渡、多元素間的切換過渡亡嫌、多組件間的切換過渡嚎于。
1. 單元素/組件間的過渡
定義：任何組件/元素添加進(jìn)入/離開過渡
方式：css過渡、css動畫挟冠、js鉤子函數(shù)--（使用v-if于购、v-show達(dá)到效果）
css過渡和css動畫都是增加或者刪除css過渡clas，唯一的區(qū)別是v-enter在元素插入dom后并不會立即刪除知染，會在動畫觸發(fā)時刪除肋僧。
過渡類型有6種：v-enter，v-enter-active控淡、v-enter-to嫌吠， v-leave，v-leave-active掺炭， v-leave-to辫诅。其存在周期如下圖所示：
js鉤子函數(shù)有：before-enter, enter,after-enter, before-cancelled、before-leave竹伸、leave泥栖、after-leave、leave-cancelled
2. 多元素間的切換過渡
定義：多個元素間進(jìn)行切換顯示勋篓，添加key元素至關(guān)重要
方式：依然可以使用v-if吧享、v-show，或者在js中進(jìn)行switch/case之類的篩選
3. 多組件間的切換過渡
定義：動態(tài)切換組件譬嚣，不需要key屬性
方式： view字段標(biāo)注使用組件的名稱
4. 列表過渡
定義：列表的每一項(xiàng)都需要進(jìn)行過渡
方式：默認(rèn)渲染成span钢颂，也可以通過tag標(biāo)簽修改
注意事項(xiàng)：
1. 不會以真實(shí)的元素渲染，會默認(rèn)渲染成span
2. JavaScript 式過渡的時候拜银，?在?enter?和?leave?鉤子函數(shù)中殊鞭，必須有?done?回調(diào)函數(shù)遭垛。否則，這兩個鉤子函數(shù)會被同步調(diào)用操灿，過渡會立即完成
