微信小程序 Record API详解及实例代码


Posted in Javascript onSeptember 30, 2016

微信小程序 Record API详解及实例代码

其实这个API也挺奇葩的,录音结束后success不走,complete不走,fail也不走, 不知道是不是因为电脑测试的原因,只能等公测或者等他们完善。以后再测和补充吧!!!!

主要属性:

wx.startRecord(object)

微信小程序 Record API详解及实例代码

手动调用wx.stopRecord()停止录音

wxml

<!--用于记录时间-->
<text>{{formatRecordTime}}</text>
<button type="primary" bindtap="listenerButtonStartRecord">开始录音</button>
<button type="primary" bindtap="listenerButtonStopRecord">结束录音</button>

js

var util = require('../../../utils/util.js')
var interval
Page({
 data:{
   //录音显示类型
  formatRecordTime: '00:00:00',
  //计数
  recordTime: 0,
 },

 onLoad:function(options){
  // 页面初始化 options为页面跳转所带来的参数
 },
 /**
  * 监听按钮点击开始录音
  */
 listenerButtonStartRecord: function() {
   that = this;
   interval = setInterval(function() {
   that.data.recordTime += 1   
   that.setData({
     //格式化时间显示
     formatRecordTime: util.formatTime(that.data.recordTime)
   })  
   }, 1000)
   wx.startRecord({
     success: function(res) {
       console.log(res)
       that.setData({
         //完成之后重新绘制
         formatRecordTime: util.formatTime(that.data.recordTime)
       })
     },
     /**
      * 完成清除定时器
      */
     complete: function() {
       clearInterval(interval)
     }
   })
 },
 /**
  * 监听手动结束录音
  */
 listenerButtonStopRecord: function() {
  wx.stopRecord();
  clearInterval(interval);
  this.setData({
    formatRecordTime: '00:00:00',
    recordTime: 0
  })
 },
 onReady:function(){
  // 页面渲染完成
 },
 onShow:function(){
  // 页面显示
 },
 onHide:function(){
  // 页面隐藏
 },
 /**
  * 当界面关闭时停止定时器关闭录音
  */
 onUnload:function(){
  // 页面关闭
  wx.stopRecord()
  clearInterval(interval)
 }
})

感谢阅读此文,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
另类调用flash无须激活的方法
Dec 27 Javascript
JS中字符问题(二进制/十进制/十六进制及ASCII码之间的转换)
Nov 03 Javascript
jQuery 插件 将this下的div轮番显示
Apr 09 Javascript
jquery异步循环获取功能实现代码
Sep 19 Javascript
innerHTML与jquery里的html()区别介绍
Oct 12 Javascript
jQuery动态添加、删除元素的方法
Jan 09 Javascript
JavaScript中获取样式的原生方法小结
Oct 08 Javascript
jQuery切换所有复选框选中状态的方法
Jul 02 Javascript
jquery实现拖动效果
Aug 10 Javascript
玩转NODE.JS(四)-搭建简单的聊天室的代码
Nov 11 Javascript
JS+HTML5实现获取手机验证码倒计时按钮
Aug 08 Javascript
JS合并两个数组的3种方法详解
Oct 24 Javascript
微信小程序 Image API实例详解
Sep 30 #Javascript
微信小程序 wx.request(object) API详解及实例代码
Sep 30 #Javascript
JavaScript 链式结构序列化详解
Sep 30 #Javascript
Bootstrap3 Grid system原理及应用详解
Sep 30 #Javascript
CSS3 media queries结合jQuery实现响应式导航
Sep 30 #Javascript
微信小程序 LOL 英雄介绍开发实例
Sep 30 #Javascript
javascript的几种写法总结
Sep 30 #Javascript
You might like
php xml 入门学习资料
2011/01/01 PHP
PHP中模拟处理HTTP PUT请求的例子
2014/07/22 PHP
用javascript来实现动画导航效果的代码
2007/12/16 Javascript
dreamweaver 安装Jquery智能提示
2011/04/02 Javascript
JavaScript创建类/对象的几种方式概述及实例
2013/05/06 Javascript
jquery实现metro效果示例代码
2013/09/06 Javascript
AngularJS语法详解
2015/01/23 Javascript
JS 作用域与作用域链详解
2015/04/07 Javascript
js实现创建删除html元素小结
2015/09/30 Javascript
浅谈javascript中的Function和Arguments
2016/08/30 Javascript
Bootstrap CSS组件之按钮下拉菜单
2016/12/17 Javascript
原生JS实现图片左右轮播
2016/12/30 Javascript
javascript实现数据双向绑定的三种方式小结
2017/03/09 Javascript
利用PM2部署node.js项目的方法教程
2017/05/10 Javascript
微信小程序上传图片到服务器实例代码
2017/11/07 Javascript
关于HTML5的data-*自定义属性的总结
2018/05/05 Javascript
JS中通过url动态获取图片大小的方法小结(两种方法)
2018/10/31 Javascript
Vue.js递归组件实现组织架构树和选人功能案例分析
2019/07/03 Javascript
Vue学习笔记之计算属性与侦听器用法
2019/12/07 Javascript
[32:26]EG vs IG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
跟老齐学Python之玩转字符串(2)
2014/09/14 Python
python实现拓扑排序的基本教程
2018/03/11 Python
Python实现查看系统启动项功能示例
2018/05/10 Python
解决PyCharm不运行脚本,而是运行单元测试的问题
2019/01/17 Python
python基于Selenium的web自动化框架
2019/07/14 Python
Windows系统Python直接调用C++ DLL的方法
2019/08/01 Python
Python面向对象魔法方法和单例模块代码实例
2020/03/25 Python
Django模板之基本的 for 循环 和 List内容的显示方式
2020/03/31 Python
浅析Python 责任链设计模式
2020/09/11 Python
科颜氏加拿大官方网站: Kiehl’s加拿大
2016/08/16 全球购物
巴黎一票通:The Paris Pass
2018/02/10 全球购物
大一自我鉴定范文
2013/12/27 职场文书
企业家王石演讲稿:坚持与放下
2014/04/27 职场文书
法制宣传教育方案
2014/05/09 职场文书
2015年车间安全管理工作总结
2015/05/13 职场文书
离婚纠纷代理词
2015/05/23 职场文书