微信小程序:当一个页面需要使用搭配多个展开收起按钮效果,你要怎么做?

98 阅读1分钟

微信小程序:当一个页面需要使用搭配多个展开收起按钮效果,你要怎么做? 第一步:获取后端返回的数据,在每个数据后面加字段做控制标识。

image.png

第二步:再点击事件把当前的数据唯一标识传递过来然后与原数组做对比去修改数据,然后修改数据赋值(至于为什么不直接传递过来的第一步加的控制标识符是因为做不了响应,如果在data里面加一个控制字节会出现状态共享问题)

expandHide(e) {
    let {
      index
    } = e.currentTarget.dataset
    let hisStepsData = this.data.hisStepsData.map((item, i) => {
      if (index == i) {
        item.descLength = !item.descLength
        return item
      }
      return item
    })
    this.setData({
      hisStepsData
    })
    // 按钮下标赋值一定要早修改状态,添加类名之后执行,不然会修改上次点击的数据的按钮状态
    this.setData({
      descClassIndex: e.currentTarget.dataset.index
    })

  },

image.png