GearCase UI v0.2 版本

evenyao發表於2018-12-29

12 月閒暇的時間一直在更新 GearCase。通過不懈的努力,GearCase 今天迎來了一次中間版本的更新,這次的更新主要加入了 Springs 動畫元件,部分元件也新增了此元件的動畫效果。

> 除此之外還按照之前 jQuery 封裝實現過的輪播方式 的思路,重新制作了 Vue 輪子版本的元件,並提供了相應的 api 方便使用。

 

重新複習 Vue 動畫

在準備做動畫和輪播元件之前,重新閱讀了 Vuejs 動畫的相關文件。

輪播 slides 元件已在 v0.2.2 版本新增。

重新讀完文件之後,在構建元件的過程當中,發現若是單純使用 Vuejs 動畫效果 fade-enterfade-leave的思路來實現輪播等效果,會產生很多視覺 bug

雖然 Vuejs 是 MVVM 框架,不建議去操作 DOM,而是使用資料驅動檢視的方式。
但是為了更加完美的實現動畫效果,不得不使用操作 DOM 的方式。再檢視了 element-ui 和 ant design 的元件之後,我發現這兩款 UI 框架都是採取操作 DOM 的方式來實現 slides 。畢竟這是最好的解決方式,又讓我想起了那句老生常談的道理。

無論使用何種方法,能夠最有效解決問題的,一定是最佳解答。

 

其他

官網文件的 其他 中新增了歷史版本資訊,並標註出了當前最新的版本。

??‍? v0.2 版本將會持續更新和優化,v0.3 版本將帶來更多的元件。To Be Continued …

相關文章