详细说明微信setData回调函数中的坑

最近在做录音功能，要求如下：点击开始录音按钮，页面状态变为录音，然后开始录音。

但是，大考同学发现了一个问题：当你快速连续点击开始录制按钮时，会触发多个事件开始录制，所以在录制结束时还是会有一个正在录制的logo，就像这个：

下面开始一段曲折的修复之路：

初始代码是这样的：

Page({ /** *生命周期函数-监视器页面加载*/onload:函数(选项){//初始化录制管理器this . recordermanager=wx . getrecordermanager()//录制开始事件this . recordermanager . onstart(()={ })}，/** *录制按钮单击事件*/taprecordbtn 3360 function(){ this . setdata({//切换页面显示}，()={//开始录制this . recordermanager . start({ })})。})我此时的猜测是，在页面重新渲染之前，按钮还是显示的，所以还是可以点击的。

在这种情况下，添加一个徽标。单击一次后，在页面重新呈现之前，您不能再次单击。代码如下：

页面({ /** *生命周期函数-监控页面加载*/onload:函数(选项){//初始化录制管理器this . recordermanager=wx . getrecordermanager()//单击录制开始按钮以识别此。isrecrdbtnclicked=false//开始记录此事件。recorder manager . onstart(()={ })}，/* * *录制按钮点击事件*/tapecordbtn 3360函数(){//如果录制按钮已被点击(录制即将开始)，录制开始事件if (this。isrecrdbtnclicked){ return }此。isrecrdbtnclicked=true this . setdata({//switch page display })不会再次被触发。()={这个。isrecordbtnclicked=false//开始录制此内容。recordermanager.start ({})})}，})这个想法不错，但是没有达到预期的效果。仍然可以多次点击。

因此，经过多次实验，改为以下方式(可行):

页面({ /** *生命周期函数-监控页面加载*/onload:函数(选项){//初始化录制管理器this . recordermanager=wx . getrecordermanager()//单击录制开始按钮以识别此。isrecrdbtnclicked=false//开始记录此事件。recorder manager . onstart(()={//修改录制开始时录制按钮的点击状态。isrecordbtnclicked=false })，/* * *录制按钮点击事件*/tapecordbtn 3360函数(){//如果录制按钮已经被点击(录制即将开始)，录制开始事件if (this。isrecrdbtnclicked){ return }此。isrecrdbtnclicked=true this . setdata({//切换页面显示}，()={//开始录制此内容。录制开始时将单击recordermanager.start ({})})}，})

再来说说最终的验证结果：setData()方法的回调函数在页面重新渲染后没有执行，所以回调函数不能作为一个确定的时间点来处理一些逻辑。recorderManager.onStart()方法在触发时有一定的延迟，所以间接解决了这个问题。

以上就是本文的全部内容。希望对大家的学习有帮助，支持我们。