微信小程序按鈕選中（單選，多選）

微信小程序按鈕選中（單選，多選）

<view wx:for="{{testList}}" wx:key="{{item}}" class="operationButton">
        <button data-value="{{item}}" 
	        class="{{index==clickindex[index]?'clickbutton':'clickbutton2'}}" 
	        data-index="{{index}}" 
	        catchtap="catchButton">{{item}}
        </button>
</view>

1：單選

// js部分

var clickindex = new Array();

catchButton:function(e){
    // console.log(e);
    // console.log(clickindex[index])
    var index = e.currentTarget.dataset.index;
    var value = e.currentTarget.dataset.value;

    clickindex[index] = index

    this.setData({
      clickindex: clickindex
    })
 }

//css 部分

.clickbutton{
  background:#2d8cf0;
  color:white;
}
.clickbutton2{
  color: #888888;
} 

2：多選

catchButton:function(e){
    // console.log(e);
    // console.log(clickindex[index])
    var index = e.currentTarget.dataset.index;
    var value = e.currentTarget.dataset.value;
    if (clickindex[index]==undefined){
      //點擊選中
      operationList.push(value);
      clickindex[index] = index
    }else{
      //取消選中
      for (var i = 0; i < operationList.length;i++){
        if (operationList[i]==value){
          operationList.splice(i,1);
        }
      }
      clickindex[index] = undefined
    }
    this.setData({
      clickindex: clickindex
    })
    //上傳到數據庫的值
    console.log("選中的值爲");
    console.log(operationList);
      
  },

//css 部分

.clickbutton{
  background:#2d8cf0;
  color:white;
}
.clickbutton2{
  color: #888888;
}