折叠面板

<!-- 折叠面板 -->
  <view wx:for="{{produceList}}" wx:key="id">
    <view class="horizontal between" data-index="{{index}}" bindtap='changeToggle'>
      <view class="">折叠条左边内容</view>
      <view class="horizontal">折叠条右边内容<text class="{{selectedFlag[index]?'triangle-up':'triangle-down'}}"></text></view>
    </view>
    <view class='' hidden="{{!selectedFlag[index]}}">
      <!-- 折叠显示的内容 -->
    </view>
  </view>

.triangle-down{
  width: 0;
  height: 0;
  border-width: 8px 4px 0;
  border-style: solid;
  border-color:#b2b2b2 transparent transparent;
  margin: 5rpx 0 0 10rpx;
}
.triangle-up{
  width:0;
  height:0;
  border-width:0 4px 8px;
  border-style:solid;
  border-color:transparent transparent #b2b2b2;
  margin: 5rpx 0 0 10rpx;
}

// 默认false，状态变化修改对应index下标的状态值
const foldStatus = [false, false, false, false, false, false, false, false, false, false, false, false, false, false, false]; //一页15条数据



// 展开折叠选择  
  changeToggle: function (e) {
    var index = e.currentTarget.dataset.index;
    if (this.data.selectedFlag[index]) {
      this.data.selectedFlag[index] = false;
    } else {
      this.data.selectedFlag[index] = true;
    }
    this.setData({
      selectedFlag: this.data.selectedFlag
    })
  },