vue中 transition組件使用總結


博客園比較啃爹啊,隨筆只能手寫,之前寫在有道雲筆記里面的內容也復制不了,憂傷.....

長話短說,看官方的transition 的講解,可能是內容太多了,或者就是本人太辣雞了,看的有點懵逼,但是項目中有需要使用,套用了官方的例子,勉強算是完成了想要的效果,

回過頭來總結一波還是有必要的,,剛開始看到有6個屬性的時候,我是拒絕的,納尼,6個,這誰頂得住啊,不過好在有一張圖,一圖勝千言吶,

 

更具圖呢,將6個屬性兩兩分組,分成三組來看待,

Enter的 頭和leave的尾一組, 就是剛進的初始狀態跟離開的結束狀態,這兩表現是一致的

Enter的尾和Leave的頭一組,進去的結束狀態和離開的開始狀態,也是一致的

這讓我不得不想起一句話,你榮耀的定點就是你進入下坡的起點,這個設計還是很有哲理的,對吧

 

然后就是v-enter-active跟 v-leave-active這兩貨了,這兩個主要就是用來設置過渡的持續時間以及過渡的表現形式(緩動還是勻速...)

這樣,一般的過渡效果就可以完成了。

感謝各位看官的收看,如果寫得不好的,盡管提意見,謝謝啦!!!

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM