微信小程序中的单选

1、wxml中

<!-- 合作方式 -->
<view class="release_subtitle">合作方式</view>
<view class="public_options">
  <text wx:for="{{cooperationMode}}" wx:key="index" class="{{item.isSelected == true ?'publicOptionActive':''}}" bindtap="selectedCooperationMode" data-id="{{item.id}}">{{item.text}}</text>
</view>

2、data中数据格式

//合作方式
cooperationMode: [
  {
    id: 0,
    text: "纯佣",
    isSelected: false,//是否选择 false：否， true：是
  }, {
    id: 1,
    text: "推广费+佣金",
    isSelected: true,//是否选择 false：否， true：是
  },
],

3、js中

/*
*@Description: 选择合作方式
*@MethodAuthor: LiJuncai
*@Date: 2022-06-10 16:34:52
*/
selectedCooperationMode: function (val) {
 var { id } = val.currentTarget.dataset
 this.data.cooperationMode.map(function (val) {
   if (val.id == id) {
     val.isSelected = true;//是否选择 false：否， true：是
   } else {
     val.isSelected = false;//是否选择 false：否， true：是
   }
 })
 this.setData({
   cooperationMode: this.data.cooperationMode,
 })
},