在vue項目中使用動畫其實有多種方式，可以使用vue中的過渡transition，可以使用animate動畫與transition配合使用，也可以單獨使用animate動畫庫（詳情可見vue官網(wǎng)-過渡：過渡），下面我們開始介紹在vue中單獨使用animate動畫，其實也非常簡單，兩步留可以實現(xiàn)：

第一步：安裝：

在命令行中執(zhí)行：npm install animate.css --save

第二步：引入及使用：

main.js中：

import animated from 'animate.css' // npm install animate.css --save安裝，在引入Vue.use(animated)

使用：

vue模板中：

<div class="ty">  <!-- 直接使用animated中的動畫class名，注意：必須使用animated這個class名，否則動畫會無效 --> <div class="box animated bounceInDown"></div></div>

總結(jié)

以上所述是小編給大家介紹的animate.css在vue項目中的使用教程，希望對大家有所幫助，如果大家有任何疑問歡迎給我留言，小編會及時回復(fù)大家的！