点击按钮显示正确错误状态（点击到正确显示绿色，点击到错误显示红色）

 

效果如下:

wxml:

<view class='difficult2 '>
  <block wx:for="{{dif2_select}}" wx:key="{{index}}">
    <view class="select {{item==answer&&index==id?'correct':''}}  {{item!=answer&&index==id?'error':''}}" bindtap='choose_2' data-concent='{{item}}' data-index='{{index}}'>   
        {{item}}</view>
  </block>
</view>

 

wxss:

/* 难度2 */
.difficult2 {
  margin-top: 65rpx;
}

.difficult2 .select {
  height: 80rpx;
  line-height: 80rpx;
  border-radius: 80rpx;
  margin-bottom: 20rpx;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: #333;
}

.difficult2 .error {
  background: #ff4c4d;
  color: #fff;
}

.difficult2 .correct {
  background: #3ccc1f;
  color: #fff;
}

 js

data:{
    answer: '迪丽热巴',  //正确答案
    dif2_select: ['迪丽热巴', '古力娜扎', '热依扎', '郑爽'],  //选项
}


 choose_2: function (e) {
    var that = this;
    console.log(e.currentTarget.dataset.index);
    var index = e.currentTarget.dataset.index; //本次点击的下标
    that.setData({
      id: index
    })
    },