小程序的动画效果

我用的是mpvue开发的小程序
动画效果的代码如下:

<div :animation="animationData" class="commodity_attr_box" v-if="showModalStatus">
	<!--内容-->
</div>



data(){
	return (){
		animationData:{}
	}
},
methods:{
  showModal: function () {
    // 显示遮罩层
    var animation = wx.createAnimation({
      duration: 200,
      timingFunction: "linear",
      delay: 0
    })
    this.animation = animation
    animation.translateY(300).step()
   
      this.animationData=animation.export(),
      this.showModalStatus=true
    
    setTimeout(function () {
      animation.translateY(0).step()
     
        this.animationData=animation.export()
      
    }.bind(this), 200)
  },
  //隐藏对话框
  hideModal: function () {
    // 隐藏遮罩层
    this.payvalue=''
    this.inputmoney=''
    var animation = wx.createAnimation({
      duration: 200,
      timingFunction: "linear",
      delay: 0
    })
    this.animation = animation
    animation.translateY(300).step()
  
    this.animationData=animation.export(),
    
    setTimeout(function () {
      animation.translateY(0).step()
  
      this.animationData=animation.export(),
      this.showModalStatus=false
    
    }.bind(this), 200)
    },
}