<view>
   <view bindtap="clickMe">点我有动画</view>
   <view animation="{{donghua}}" class='test'>点我有动画---测试</view>
</view>

data:{
    donghua:""
},
//----------------------------------1、创建动画实例  , ani 是 onLoad 的一个属性
onLoad: function (options) {
    //动画可以挂载到这里 ！！ 
    this.ani = wx.createAnimation({
        duration:1000,
        timingFunction:"liner"
    })
 },
 //-----------------------------------2、实现动画效果 ,  step() 表示一组动画完成。
  clickMe(){
    this.ani.left(50).top(50).step() //可改变的相关值可以自行查找 API
    //---------------------------------3、导出动画 。
    this.setData({
      donghua:this.ani.export()
    })
  },

.test{
    position: absolute;
    left:150px;
    top:150px;
/* 这里设置了left 和 top 的初始值 ， 动画效果更明显 */
}

@import "./utils/animate.wxss";

<view>
    <view bindtap="showPickV">点我动画</view>
    <view class='pickV animated {{bounceInUp}} {{goBottom}}'>123</view>
</view>

page{
   height:100%;
   overflow: hidden;
   /* 防止pickV定位有滚动条 */
}
.pickV{
   position: absolute;
   bottom:-100%;
}
.goBottom{
   bottom:0;
}

data:{
    bounceInup:"",
    goBottom:"",
    isShow:false,
},
showPickV(){
    if(this.data.isShow == false){
      this.setData({
          bounceInUp:"bounceInUp",
          goBottom:"goBottom"
      })
    }else{
      this.setData({
          bounceInUp: "bounceOut",
          goBottom:""
      })
    }
    this.setData({
        isShow:!this.data.isShow
    })
}