6、Vueのアニメーションパッケージ(Vueのアニメーション特効)
1365 ワード
Vue
hello world
hello world
Vue.component('fade',{
props:['show'],
template:'<transition @before-enter="handleBeforeEnter" @enter="handleEnter">' +
'<slot v-if="show"></slot></transition>',
methods:{
handleBeforeEnter:function (el) {
el.style.color='red'
},
handleEnter:function (el,done) {
setTimeout(()=>{
el.style.color ='blue',
done()
},2000)
}
}
})
var count =0;
var vm =new Vue({
el:"#app",
data:{
show:false
},
methods:{
handleBtnClick:function () {
this.show=!this.show
}
}
})