Vue用velocity.js的动画

Posted 2021-02-16 我就是要叫鱼摆摆

1.先引入velocity的js

用法

<transition name="fade"

@before-enter="beact"
@enter="eact"
@before-leave="blact"
@leave="lact"
>
<div v-if="show" >hello world</div>
</transition>

methods:{
                  
                    blact:function(el){
                        //用法
                        Velocity(el,{
                            opacity:1
                        },{
                            duration:1000,
                            complete:done()
                            })
                    },

 

complete这个属性加上done（）函数，当velocity执行完这个动画之后complete这个属性对应的内容会被自动执行，执行done（）函数，接下来的钩子周期继续执行