微信小程序ajax数据for循环 状态默认选中第一个 点击按钮添加class样式

<block wx:for="{{grades}}" wx:for-item="items">
  <view class='gradeinfo'>{{items.name}}</view>
  <view class='gradelist'>
    <button class="{{actived == item ? 'active' : ''}}" data-item="{{item}}" 
    wx:for="{{items.list}}" wx:for-item="item" bindtap="tagChoose">{{item}}</button>
  </view>
</block>

---

res里的数据

res.data里的数据

res.data.data里的数据

而wx:for循环的内容是要具体到data的。

grades 是ajax总数据 grades = res.data.data;
actived默认选中第一个 给静态的数据 gradeArray[0]['list'][0]
点击时改变样式，通过item来判断，data-item="{{item}}" 给options.currentTarget.dataset里传一个参数进行对比，选中的和item相等就添加active样式


完善后的选择年级：如果选择过就获取选中的值 var selectedSubject = _this.data.seleted;，actived传的值就是 selectedSubject；如果没有选择过就默认选中第一个actived: gradeArray[0]['list'][0]//默认选中初始值.

Page({
  data: {
    grades: [],
    actived:''
  },
  onLoad: function (options) {
   wx.request({
      success(res) {
        var gradeArray =res.data.data;
        var selectedSubject = _this.data.seleted; //选择过年级
        if(!selectedSubject){
          selectedSubject = gradeArray[0]['list'][0];
        }
        _this.setData({
          grades:gradeArray,
          actived: selectedSubject
        })
      }
    })
  },
  tagChoose: function (options) { //点击时
    var that = this;
    that.setData({
      actived: options.currentTarget.dataset.item
    })
  }
});