小程序数据绑定点赞效果切换（交流QQ群：604788754）

如果对本例有更好的意见和建议，希望给予留言或是加群跟群主联系，交流学习。

WXML:

<block wx:for="{{nums}}" wx:for-index='idx' wx:for-item='item'>
  <view class="maxbox"  bindtap="imgchange" data-id="{{idx}}">
    <view class="zan">
      <image wx:if="{{ item.id == idx }}" class="zan01" src="img/zan1.png" ></image>
      <image wx:else class="zan01" src="img/zan2.png"></image>
    </view>
    <text class="nums">{{item.num}}</text>
  </view>
</block>

 JS:

Page({
  data: {
    nums: [
      { id: 0, num: 11 },
      { id: 1, num: 22 }
    ]
  },
  imgchange: function (event) {
    //获取当前item的下标id  通过currentTarget.id
    //data-id
    var dataid = event.currentTarget.dataset.id;
    var nums = this.data.nums[dataid].num;
   //数据里面的id;
    var ids = this.data.nums[dataid].id; 
    if ( dataid == ids ){
      nums++;
      this.data.nums[dataid].num = nums;
      this.data.nums[dataid].id = ids + 1; 
      this.setData({
        nums: this.data.nums
      });
    }else{
      nums--; 
      this.data.nums[dataid].id = ids - 1; 
      this.data.nums[dataid].num = nums;
      this.setData({
        nums: this.data.nums
      });
    }
  },
}) 

 效果如下：