我的需求是做一个砸金蛋功能,点击金蛋弹出modal ,这个modal是一个砸金蛋的动画。第一次执行这个点击事件触发这个事件没有问题,但是当我关闭这个modal再次打开 这个动画效果不触发了,求解答在这先谢过了,下面附上代码(点击事件触发下面弹框有定义了动画animationData,调用基础库是2.1.1)
<!--砸金蛋modal -->
<view class="modal-mask" bindtap="hideModal" catchtouchmove="preventTouchMove" wx:if="{{showModal}}"></view>
<view class="modal-dialog" wx:if="{{showModal}}">
<view class="modal-background">
<view class="modal-out" style="">
<view bindtap="remove">关闭金蛋模态框</view>
<image bindtap="eggclick" src="../../static/images/egg.png" style="height:325rpx;width:301rpx;"></image>
<view style="position:absolute;right:0rpx;top:-180rpx">
<image class="modal-chui" animation="{{animationData}}" src="../../static/images/chuizi.png" ></image>
</view>
</view>
</view>
</view>
clickeggs: function () {
this.setData({ showModal: true });
let animation1 = wx.createAnimation({
duration: 1000,
transformOrigin: "right bottom",
timingFunction: 'ease'
})
setTimeout(function () {
animation1.rotate(-25).step()
animation1.rotate(15).step()
animation1.rotate(-25).step()
animation1.rotate(15).step()
animation1.rotate(-25).step()
animation1.rotate(15).step()
this.setData({
animationData: animation1.export(),
})
}.bind(this), 200);
},
有人知道吗
有人吗
百度查遍了,我到是有点眉目
锤子这个图片旋转了角度没有复位
重复执行的animation建议写在CSS,
文档上并没有css上的写法啊
解决了吗,我也是遇到同样问题,动画执行第一次正常,
用hidden ,
有结果了么?
还没有 有个大哥在帮忙看,wechatide://minicode/qTduWMmG7fTX 这个是代码片段
能做个代码片段吗?
https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html
好的 我马上做一个
wechatide://minicode/qTduWMmG7fTX
处理中……请稍后
好的,万分感谢