vue2借助animate.css实现路由动画效果

第一步：

npm install animate.css --save

第二步：打开main.js

import animate from 'animate.css'

Vue.use(animate)

第三步：

<transition

:duration="1000"

mode="out-in"

appear

enter-active-class="animated fadeIn"

leave-active-class="animated fadeOut"

appear-active-class="animated zoomInDown" >

<router-view />

</transition>

 完成这三步之后，点击页面的每一个路由都会有动画效果了

1. vue2路由动画效果实现

2. 在vue中使用animate.css

3. Animate.css官网

4. animate.css的使用--小火柴

5. vue使用animate.css进行路由跳转

 

转载于:https://www.cnblogs.com/knuzy/p/9516454.html