- 過(guò)渡效果
// 1. 標(biāo)簽一樣的情況下 要設(shè)置key才能啟動(dòng)動(dòng)畫(huà)
// 2. mode可以指定不同的內(nèi)容顯示狀態(tài)
// 3. transition里面的name屬性可以自定義
<transition name="fade" mode="out-in">
<p v-if="show" key="1">one part </p>
<p v-else key="2">two part</p>
</transition>
<style>
/*自定義動(dòng)畫(huà)*/
.fade-enter-active,.fade-leave-active{
transition: opacity .5s ease-out;
}
.fade-enter, .fade-leave-active {
opactiy: 0;
}
</style>
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀(guān)點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。