小程序点击事件，添加class样式

业务场景：点击对应的积分的时候，给加上颜色

 

实现方案：首先这三个积分类型是datas循环出来的,我们需要使用小程序的data-来自定义属性，在点击不同类型的时候，获取到对应的id，将这个id拿到js那边重新附一个值isSelect，在进行判断isSelect跟循环的id是否相等，相等的时候加

/*
author:咔咔
address：陕西西安
wechat:fangkangfk
*/

<view class="top2">
      <view class="listitem" wx:for="{{datas}}" wx:key="{{index}}">
 
      <view class='{{isSelect==item.id? "toplists clicks": "toplists"}}' data-price="{{item.price}}"   data-integral="{{item.integral}}" data-id="{{item.id}}" bindtap="select">
          {{item.integral}}积分
      </view>
      </view>
      
    </view>

 

js代码

/*
author:咔咔
address：陕西西安
wechat:fangkangfk
*/
 
// 选择不同的积分获得不同的价钱
  select:function(e){
    console.log(e)
    var sum = e.target.dataset.price;
    var integralNum = e.target.dataset.integral;
    var id = e.target.dataset.id;
    this.setData({
      sum: sum,
      integralNum: integralNum,
      isSelect: id
    })
  },