15個有用的React動畫庫，馬上讓你的項目變得高大上
英文 | https://javascript.plainenglish.io/18-useful-react-animation-libraries-you-can-consider-using-in-2021-7cad00dbf525
翻譯 | web前端開發
動畫在網站應用中也非常頻繁，像頁面過渡，滾動事件，進入和退出以及提醒用戶注意的事件。例如像下圖中的動畫效果，是不是很酷？如果在實際開發中，你也有這樣的需求，那今天我跟大家分享的這些庫，一定有你需要的。
現在，就讓我們看一下可以與React集成在一起的15個React動畫庫，以生成交互式且吸引人的網頁效果，希望這些庫可以幫助你提升開發效率。
1、React Spring
該庫是一種現代動畫效果。這個庫在Github也非常受歡迎。並且該庫會讓你的網站變得更加優雅。
示例效果如下：
2、React Circle
一組隨時間變化的動態組件動圖效果，顏色，大小比例等均可以調整。
示例效果如下：
3、粒子效果按鈕
該工具能夠在按鈕上創建類似Thanos的快照效果。你可以選擇不同的效果。
示例效果如下：
4、React Stonecutter
React的動畫網格布局組件。你可以在CSS過渡或react-Motion中選擇動畫效果。
示例效果如下：
5、Ant Motion
這是Ant Design的運動設計規范，還為你的React應用程序提供了包含許多現成動畫的完整解決方案。
示例效果如下：
6、React滾動視差
這個React組件用於為橫幅，圖像或其他DOM元素創建視差滾動效果。
示例效果如下：
7、React Loading
你可以使用此工具為React項目創建加載動畫效果。
示例效果如下：
8、React翻轉工具包
你可以使用此React動畫創建輕量級的魔術移動庫，以進行可配置的布局過渡。
示例效果如下：
9、React Typist
使用此React組件創建打字動畫效果。環繞文本或任何元素的文本進行動畫處理。易於樣式化和高度可配置。
示例效果如下：
10、Fluid Transitions
該庫實現了一個新的導航器組件FluidNavigator，該組件具有與相同的接口和路由配置StackNavigator。效果如下：
11、React Native動畫
標准的易用動畫集和React Native的聲明式過渡動畫效果。
示例效果如下：
12、React動畫
可以與任何內聯樣式庫一起使用的動畫集合，支持使用對象來定義關鍵幀動畫，例如Radium或Aphrodite。
示例效果如下：
13、React Motion
這個庫還為React的提供了一個更強大的替代API Transition Group。
示例效果如下：
14、Pose
這是一個用於React，React Native，Vue甚至是普通JavaScript的簡單動畫庫。
示例效果如下：
15、React Transition Group
當React組件進入或離開DOM時，這是一種簡單的執行動畫效果，實現方法簡單。
示例效果如下：
學習更多技能
請點擊下方web前端開發