微信小程序实现 给每一个元素对象item做动画，并且相互之间不影响实现

如图所示，实现点击切换展开与闭合。小三角加上旋转的动画，并且item之间互相不影响

<view class='i-bottom' bindtap='showDetail' data-id="{{index}}" >
     <view>点击查看办理详情</view>
     <view class="arrow" animation="{{animationList[index]}}"></view>
</view>

谁要做动画，就把动画属性animation加到谁的身上

data{
	animationList: [], // 存放动画的序列数组
},
	// 用户点击的时候做动画
  showDetail(e) {
    const that = this
    let index = e.currentTarget.dataset.id
    let animationList = this.data.animationList
    // 创建动画实例，调用实例的方法来描述动画。最后通过动画实例的 export 方法导出动画数据传递给组件的 animation 属性。     做动画  将来可以封装一个方法去调用
    var animation = wx.createAnimation({
      duration: 200,
      timingFunction: 'ease',
      delay: 0
    })
    // console.log(animation) // 动画实例animation   对象中有一个属性 currentTransform 里面有个属性值 rotate 是后来我们自己加上去的
    this.animation = animation // 将动画挂载到全局中去
    if (!that.data.cardItem[index].isTrue) { // 如果当前用户点击的元素的 isTrue值为false (默认就是false)
      this.animation.rotate(225).step() // 给动画对象 挂载 旋转动画属性
    } else {
      this.animation.rotate(45).step()
    }
    animationList[index] = animation.export() // 将当前的动画对象数据序列放入animationList数组中  export方法每次调用后会清掉之前的动画操作
    let isTrue = "cardItem[" + index + "].isTrue" //获取当前点击的数组中对象的值   // cardItem[1].isTrue
    // console.log(isTrue)
    this.setData({
      animationList: animationList // 修改新的动画数组
    })
    setTimeout(function() {
      that.setData({
        [isTrue]: !that.data.cardItem[index].isTrue, 
      })
    }, 200)
  },

终于完成。还是需要多逛逛官方文档，多理解。