49 lines
1.0 KiB
Vue
49 lines
1.0 KiB
Vue
<template>
|
||
<view :animation="animationData" v-if="show">
|
||
<slot></slot>
|
||
</view>
|
||
</template>
|
||
<style scoped>
|
||
</style>
|
||
<script>
|
||
export default {
|
||
props: {
|
||
ani: {
|
||
type: String,
|
||
default: ''
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
show: true,
|
||
animationData: {}
|
||
};
|
||
},
|
||
watch: {
|
||
ani(newD, oldD) {
|
||
this.Doani(newD);
|
||
}
|
||
},
|
||
computed: {},
|
||
mounted() {},
|
||
methods: {
|
||
async Doani(opn) {
|
||
if(this._aniing)
|
||
return;
|
||
//opn，string=anis
|
||
//{anis:string/array, init:obj}
|
||
//in out show，先show，如果是out，show=false，其他不变
|
||
//多个step执行，微信小程序会出现合并执行的bug
|
||
//设置初始style，部分低版本浏览器无效，用16ms单帧替代
|
||
//init参数希望不同step表现不同，用anis[array]，step单独传参
|
||
//matrix，xx3d等，anis[string]未定义，需anis[array]。
|
||
this.show = true;
|
||
this._aniing = true;
|
||
await this.goani(opn, data=>this.animationData=data,(key,val)=>{
|
||
this.show = false;
|
||
});
|
||
this._aniing = false;
|
||
}
|
||
}
|
||
}
|
||
</script> |