Vue中如何使用 velocity动画库
第一步:npm install velocity-animate@beta --save-dev
安装velocity动画库
第二步:在main.js引入
// 动画库
import Velocity from 'velocity-animate'
Vue.prototype.Velocity = Velocity
第三步应用:
<template>
<transition v-on:after-enter="afterEnter" v-on:enter="enter"> <div class="slide-move__line" v-if="show"></div> </transition>
</template>
methods:{
afterEnter:function(el){
console.log(el);
},
enter:function(el,done){
console.log("显示");
console.log(el);
this.Velocity(el, { opacity: 1, left: '100px' }, { duration: 300 })
this.Velocity(el, { left: '90px' }, { complete: done })
}
}