小程序实现循环输出折叠面板

wxml

<view style="margin:0 24rpx;width:702rpx;">
    <block wx:for="{{info}}" wx:key="{{index}}">
        <view class="info-list" data-index="{{index + 1}}" catchtap="onChangeShowState">
            <text class="info-name">{{item.question}}</text>
            <image class="youjiantou" src="../../../assets/icon/{{showIndex == index + 1 ? 'xiajt':'shangjt'}}.png"></image>
            <!-- <image src="../../../assets/icon/xiajt.png" class="youjiantou" animation="{{animationData}}"></image> -->
        </view>
        <view class="bright789_view_hide"  wx:if="{{showIndex == index + 1}}" >
            <text class="bright789-text">{{item.answer}}</text>
        </view>
    </block>
</view>

js

 data: {
      showIndex: 0
    },   

onChangeShowState: function (e) {
      console.log(e)
      if (e.currentTarget.dataset.index != this.data.showIndex) {
        this.setData({
          showIndex: e.currentTarget.dataset.index
        })
      } else {
        this.setData({
          showIndex: 0
        })
      }
    },

我是请求的后端数据
  onShow: function () {
      var nowShow = this.data.selectShow;
        var that = this
        wx.request({
            url: api.jc.api,
            method: 'GET',
            header: {
                'content-type': 'application/x-www-form-urlencoded'
            },
            data: {
                act: 'help',
                keys: '202cb962ac59075b964b07152d234b70',
            },
            success: function (res) {
              // console.log(res)
                if (res.data.code == 200) {
                    var info = res.data.result
                    for (var i in info){
                        info[i] = {
                            question: info[i].question,
                            typeId: i,
                            answer: info[i].answer,
                            showView: false
                        }
                    }
                    that.setData({
                        info: info,
                    })
                } else {
                  showView: "",
                    wx.showToast({
                        title: res.data.message,
                        image: "../../../assets/icon/warning.png",
                    });
                }
            },
        });
    },