收藏
回答

录音的同时,通过touchmove触发的setData感觉被阻塞了,界面上无效果

机型(如iPhone 6s plus)

华为的meta8

操作系统(如iOS 9.3)

没试过

是否必现

问题描述(具体问题介绍)


用作尝试,写了一个类似聊天对话的东西

按住后可以录音,然后会有倒计时,通过setData设置,touchmove上滑一定距离还会改变class从而变色,然后松开取消录音。开发者工具里面没什么问题。

但是真机测试的情况是,录音正常,也能通过上滑取消录音。但是一旦触发touchmove之后,虽然console.log可以看到计时器一直在减,但是setData设置的,界面上不体现效果(变色跟数字改变都没用),感觉就像被阻塞了一样,送开的一瞬间该有的setData又触发了。

不touchmove的时候,它在正常倒计时,比如计到58,一旦手指move了,哦霍,就不动了,如果console.log打印每一秒,发现还是在打印,但是界面上就卡死了

实际状况不好截图,所以做如上描述,刚刚看了今天(20161221)更新日志,很赞,但是这部分还是是这样的。

代码片段截图

touch事件我都是绑在最上层的元素,然后与那个读秒的提示框是并列关系,之前是包含关系也还是一样的。


下面是部分代码:

//计时器

var counter = {

  cnt:60,

  now:60,

  hander:undefined,

  begin:function(pageCxt){

    var _that = this;

    _that.now=_that.cnt;

    _that.oneSecond(_that,pageCxt);

  },

  end:function(pageCxt){

    sendVoice.apply(pageCxt);

  },

  oneSecond:function(that,pageCxt){

    console.time('t');

    if(that.now>0){

      that.hander = setTimeout(function(){

        console.log('-------------------')

        console.timeEnd('t');

        that.now--;  

        that.oneSecond(that,pageCxt);

        if(that.now<60){

          pageCxt.setData({

            voiceHintLimit:'还可以说'+that.now+'秒'

          });

        }else{

          pageCxt.setData({

            voiceHintLimit:''

          });

        }

        if(that.now==0){

          that.end(pageCxt);

        }

        console.log(that.now);

      },1000);

    }else{

      that.init();

    }

  }

  ,

  init:function(){

    this.now=this.cnt;

    if(this.hander){

      clearTimeout(this.hander);

    }

  }

}


//录音的

var lastVoiceRecordTmpPath;

var willUploadVoice = false;


function recordVoice(){

  var _this = this;

  willUploadVoice = false;

  wx.startRecord({

    success: function(res) {

      console.log(res);

      var lastVoiceRecordTmpPath = res.tempFilePath;

      console.log(lastVoiceRecordTmpPath);

      if(willUploadVoice){

        voiceupload({path:lastVoiceRecordTmpPath,uid:'1234567890',seconds:willUploadVoice.seconds},_this);

      }

    },

    fail: function(res) {

      wx.showToast({title:"录音失败"});

    }

  })

  this.setData({

    recordVoiceBtnText:'松开 结束'

    ,showHint:true

    ,willcancel:false

  });

  counter.init();

  counter.begin(this);

}

//录音的touch事件

function touchstart(e){

  console.log("touchstart",arguments);

  var id = e.target.id;

  if(id=='voicebtn'){

    recordVoice.apply(this);

    moveUpJudge.init();

    moveUpJudge.setP('begin',e);

  }

}


//下面是mousemove的

//moveUpJudge.judge()只是判断一个跟起始点的距离


function touchmove(e){

  //console.log("touchmove",arguments);

  var _that = this;

  if(moveUpJudge.isBegin()){

    moveUpJudge.setP('end',e);

    if(moveUpJudge.judge()){

      //变色

      if(willcancel==false){

        willcancel = true;

        _that.setData({

          willcancel:willcancel

        });

      }

    }else{

      if(willcancel==true){

        willcancel = false;

        _that.setData({

          willcancel:willcancel

        });

      }

    } 

  }

}







回答关注问题邀请回答
收藏
登录 后发表内容