基于微信小程序的长按录音、滑动取消发送功能实现~

<view class='serac_img' catch:longpress="handleRecordStart" catch:touchmove="handleTouchMove" catch:touchend="handleRecordStop">
    <image src='../../images/voice.png' mode="widthFix"></image>
    <text>长按语音识别</text>
</view>

const recorderManager = wx.getRecorderManager()
data: {
    is_clock:false
  }

handleRecordStart: function(e) {
    this.setData({
      is_clock:true,//长按时应设置为true，为可发送状态
      startPoint: e.touches[0],//记录触摸点的坐标信息
})
//设置录音参数
    const options = {
      duration: 10000,
      sampleRate: 16000,
      numberOfChannels: 1,
      encodeBitRate: 48000,
      format: 'mp3'
}
//开始录音
    recorderManager.start(options);
  }

handleRecordStop:function(e){
    recorderManager.stop()//结束录音
     //此时先判断是否需要发送录音
      if (this.data.is_clock == true) {
        var that = this
    //对停止录音进行监控
        recorderManager.onStop((res) => {
      //对录音时长进行判断，少于2s的不进行发送，并做出提示
      if(res.duration<2000){
wx.showToast({
              title: '录音时间太短，请长按录音',
              icon: 'none',
              duration: 1000
            })
}else{
  //进行语音发送
  const {
        tempFilePath
      } = res;
      wx.showLoading({
        title: '语音检索中',
      })
      //上传录制的音频
      wx.uploadFile({
        url: requestUrl + 'Rubbish/uploadVoices',
        filePath: tempFilePath,
        name: 'voice',
        success: function(event) {
          var datas = JSON.parse(event.data);
          if (datas.status == 0) {
            wx.hideLoading()
            if (datas.result) {
              that.setData({ 
                detail: datas.result.list
              })
            } else {
              wx.showToast({
                title: '如此聪明伶俐的我居然会词穷，我要喊我父亲大人送我去深造~',
                icon: 'none',
                duration: 2000
              })
            }
          } else {
            wx.showToast({
              title: datas.msg,
              icon: 'none',
              duration: 2000
            })
          }
        }
      })
}
        })
      }    
  }

handleTouchMove:function(e){
   //计算距离，当滑动的垂直距离大于25时，则取消发送语音
    if (Math.abs(e.touches[e.touches.length - 1].clientY - this.data.startPoint.clientY)>25){
      this.setData({
        is_clock: false//设置为不发送语音
      })
    }
  }