收藏
回答

小程序录音

框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
小程序 Bug iOS ios12.0.1 iphone 8 plus 6.7.3

- 当前 Bug 的表现(可附上截图)

快速点击时,不触发catch:touchend,还有catch:touchcancel,,以至于,不能停止录音

- 预期表现

像安卓一样,即使快速点击,也能触发catch:touchend,还有catch:touchcancel,,,,实现,不到一秒钟录音,弹出提示框

- 复现路径


- 提供一个最简复现 Demo

<view class="modal modal-record" bind:tap="toggleRecordModal">
    <view class="modal-body" catch:tap="toggleWithoutAction">
        <text class="desc">{{ RecordDesc[recordStatus] }}</text>
        <view
            class="dot"
            catch:touchstart="handleRecording"
            catch:touchmove="handleRecordingMove"
            catch:touchend="handleRecordingCancel"
            catch:touchcancel="handleRecordingCancel"
      catchtap='dianji'>
            <image class="icon-mic" src="../../img/mic@2x.png"/>
        </view>
    </view>
</view>
Page({
  data: {
 
  },
  onLoad: function () {
 
  },
  onShow:function(){
 
  },
  toggleWithoutAction(e) {
    // 阻止 tap 冒泡
  },
  asd: function () {
    console.log("123")
  },
  toggleRecordModal() {
    console.log("wrap")
 
  },
  handleRecordingMove(e) {
    var touches = e.touches[0];
    var changedTouches = this.data.changedTouches;
    if (!changedTouches) {
      return;
    }
 
  },
  handleRecording(e) {
    console.log("1")
    let me = this;
    this.data.changedTouches = e.touches[0];
 
    let recorderManager = wx.getRecorderManager();
    recorderManager.onStart(() => {
      console.log("开始录音...");
      me.setData({
        num: 0
      })
      me.data.setInter = setInterval(
        function () {
          var numVal = me.data.num + 1;
          me.setData({ num: numVal });
          console.log('setInterval==' + me.data.num);
        }
        , 1000);
    });
    recorderManager.start({
      format: "mp3"
    });
    // 超时
    setTimeout(function () {
      me.handleRecordingCancel();
    }, 100000);
  },
  handleRecordingCancel() {
    // 向上滑动状态停止:取消录音发放
    var that = this
 
    let recorderManager = wx.getRecorderManager();
    recorderManager.onStop((res) => {
      console.log("结束录音...", res);
      clearInterval(that.data.setInter)
 
      // 上传
      var mediaDuration = that.data.num
      if (mediaDuration < 1) {
        // mediaDuration = 1
        wx.showModal({
          title: '录音不能少于1s',
          confirmText: 'OK',
          showCancel: false
        })
      } else {
        this.uploadRecord(res.tempFilePath);
      }
    });
    // 停止录音
    recorderManager.stop();
  },
  uploadRecord(tempFilePath) {
    console.log(tempFilePath)
  }
})


回答关注问题邀请回答
收藏

5 个回答

  • 少年不在年少
    少年不在年少
    2019-02-21

     麻烦问下 解决了么?我也遇到了  小米华为出现最多,苹果概率低点

    2019-02-21
    有用
    回复 1
    • Ying
      Ying
      2019-03-02

      没有解决唉


      2019-03-02
      回复
  • 乐天⁸⁸⁰⁰⁶⁶⁷🐳
    乐天⁸⁸⁰⁰⁶⁶⁷🐳
    2019-01-02

    我也遇到了,在iPhone上快速滑动,无论向上向下,均不能触发catchtouchend,Android没这个问题。


    2019-01-02
    有用
    回复 1
    • Ying
      Ying
      2019-03-02

      是的,我们也是,但是也有可能安卓机不多,没测到

      2019-03-02
      回复
  • 2018-12-22

    几乎是同类型的问题,不过我们遇到问题的机型是荣耀十

    2018-12-22
    有用
    回复 2
    • Ying
      Ying
      2018-12-24

      解决了吗

      2018-12-24
      回复
    • 2019-03-30回复Ying

      并没有。。

      2019-03-30
      回复
  • 落叶无声xcm
    落叶无声xcm
    2018-12-21

    官方解决了吗?我也碰到这个问题了!

    2018-12-21
    有用
    回复 1
    • Ying
      Ying
      2018-12-24

      目前看来,应该是没有

      2018-12-24
      回复
  • 疯狂的小辣椒
    疯狂的小辣椒
    2018-11-08

    麻烦给个相关的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html),我们定位下问题

    2018-11-08
    有用
    回复 6
    • Ying
      Ying
      2018-11-08

      wechatide://minicode/6lX2bLmd7a3z


      谢谢

      2018-11-08
      回复
    • 2019-02-28

      跟帖跟帖,我这边也是,Android两个小米机都不行 小米5s:

      Android 8.0

      WeChat 7.0.3.1400

      WeChatLib 2.6.1


      红米Note7:

      Android 9.0

      WeChat 7.0.3.1400

      WeChatLib 2.6.1



      <view class="leave-audio-message-button" catchtouchstart="startRecord" catchtouchend="endRecord"catchtouchmove="onRecordTouchMove"></view>




      catchtouchend 第一次能够触发,第二次start后长按,就没办法监听到end事件,只能再次点击,才会监听到end。


      2019-02-28
      回复
    • 疯狂的小辣椒
      疯狂的小辣椒
      2019-02-28回复

      要不你单独发个帖吧,后续好跟进问题,提供下机型、微信版本、代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

      2019-02-28
      回复
    • 2019-02-28回复

      好奇异的事件


      两次touch,两个回调不一样

      2019-02-28
      回复
    • Ying
      Ying
      2019-03-02回复疯狂的小辣椒

      您好,请问之前的解决了吗

      2019-03-02
      回复
    查看更多(1)
登录 后发表内容