[移动开发]微信小程序 picker-view 的 bindChange延迟问题的解决办法

微信小程序 picker-view 的 bindChange延迟问题的解决办法

微信小程序的 picker-view 的bindChange存在较大的延迟，在快速滚动列表时会导致选中的数据是原来的数据，而非当前滚动到的数据。

这里提供解决办法
为确定按钮添加 disbaled值，控制确认按钮的失效时间点
<button bindtap="pickerConfirm" disabled="{{btnDisabled}}" class="pickerBtn">确认</button>
在 对应的js文件data中，设置 btnDisabled=false ，让确认按钮默认生效， 然后在滚动开始时设置
btnDisabled=true ,让按钮失效，在滚动结束后，bindChange触发时设置 btnDisabled=false 让按钮重新生效，这样才能确保点击确定时选中的数据和滚动条的一致

//滚动开始时让按钮失效
  pickerStart(){
      this.setData({
        btnDisabled:true
      })
      this.triggerEvent('pickerStart')
    },

  //滚动列表监听
  
    pickerChange(e){

      console.log("监听到滚动",e)
      this.setData({
        itemData:{  //数据需要返回给父组件
          pickerIndex:e.detail.value,  //获取滚动某一项的下标
          data:this.data.pickerDataList[e.detail.value],  //获取某一项下标的数据
        }
      },()=>{
        this.triggerEvent('pickerChange',this.data.itemData)
      })
      //滚动结束后，触发监听时让按钮生效
      this.setData({
        btnDisabled:false
      })
    },

滚动时让确认按钮失效

滚动完成后让按钮生效

如果有帮助请点赞，让我知道我写的东西确实帮到了人，谢谢