点赞动画淡入淡出

wxml

	<view class="show" animation="{{vip_animal}}">
			<text class="show1">+1</text>
						<image class="shows"  src="../images/zan.png"></image>
			</view>
			<view bindtap="giveBtn">点赞动画</view>

css

.show1{
  font-size: 32rpx;
  font-weight: bold;
  color: #f4bf3d;
  margin-right: 10rpx;
}
.show{
  position: absolute;
  top: -30rpx;
  right: 10%;
  z-index: 9999;
  opacity: 0;
}
.shows{
  width:36rpx;
  height: 36rpx;

}

js

giveBtn(){
    // 点赞
    let that=this;
    let animation=wx.createAnimation({
      duration: 1000,
    })
    animation.opacity(1).step()
    animation.opacity(0).step({duration: 3000})
    that.setData({
      zanNum:that.data.zanNum+1,
      vip_animal:animation.export()
    })
  },