微信小程序 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 相关文章推荐
兼容FireFox 的 js 日历 支持时间的获取
Mar 04 Javascript
JavaScript 继承详解 第一篇
Aug 30 Javascript
jQuery操作 input type=checkbox的实现代码
Jun 14 Javascript
JavaScript中的关联数组问题
Mar 04 Javascript
JavaScript实现的圆形浮动标签云效果实例
Aug 06 Javascript
理解javascript定时器中的setTimeout与setInterval
Feb 23 Javascript
jQuery mobile的header和footer在点击屏幕的时候消失的解决办法
Jul 01 Javascript
微信小程序注册60s倒计时功能 使用JS实现注册60s倒计时功能
Aug 16 Javascript
微信小程序App生命周期详解
Jan 31 Javascript
解决vue js IOS H5focus无法自动弹出键盘的问题
Aug 30 Javascript
使用layui的router来进行传参的实现方法
Sep 06 Javascript
js 执行上下文和作用域的相关总结
Feb 08 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获取url字符串截取路径的文件名和扩展名的函数
2010/01/22 PHP
php下拉选项的批量操作的实现代码
2013/10/14 PHP
使用PHP uniqid函数生成唯一ID
2015/11/18 PHP
详解在YII2框架中使用UEditor编辑器发布文章
2018/11/02 PHP
比较简单的一个符合web标准的JS调用flash方法
2007/11/29 Javascript
(jQuery,mootools,dojo)使用适合自己的编程别名命名
2010/09/14 Javascript
Array.prototype.concat不是通用方法反驳[译]
2012/09/20 Javascript
JS使用getComputedStyle()方法获取CSS属性值
2014/04/23 Javascript
iframe调用父页面函数示例详解
2014/07/17 Javascript
node.js中使用q.js实现api的promise化
2014/09/17 Javascript
Jsonp post 跨域方案
2015/07/06 Javascript
angularjs学习笔记之完整的项目结构
2015/09/26 Javascript
Bootstrap开发实战之响应式轮播图
2016/06/02 Javascript
JS实现HTML表格排序功能
2016/08/05 Javascript
jstree创建无限分级树的方法【基于ajax动态创建子节点】
2016/10/25 Javascript
数组Array的一些方法(总结)
2017/02/17 Javascript
利用ECharts.js画K线图的方法示例
2018/01/10 Javascript
nodejs微信扫码支付功能实现
2018/02/17 NodeJs
jQuery插件实现图片轮播效果
2020/10/19 jQuery
[00:32]2018DOTA2亚洲邀请赛EG出场
2018/04/03 DOTA
[42:50]NB vs VP 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
Python 基础之字符串string详解及实例
2017/04/01 Python
Python获取网段内ping通IP的方法
2019/01/31 Python
python自动结束mysql慢查询会话的实例代码
2019/10/27 Python
浅谈Python中range与Numpy中arange的比较
2020/03/11 Python
HTML5中如何显示视频呢 HTML5视频播放demo
2013/06/08 HTML / CSS
荷兰网上鞋店:Ziengs.nl
2017/01/02 全球购物
广告学专业应届生求职信
2013/10/01 职场文书
班长岗位职责
2013/11/10 职场文书
公司中层干部的自我评价分享
2014/03/01 职场文书
益达广告词
2014/03/14 职场文书
宝宝满月酒主持词和仪式流程
2014/03/27 职场文书
员工自我工作评价
2015/03/06 职场文书
信息简报范文
2015/07/21 职场文书
基于JavaScript实现年月日三级联动
2021/06/22 Javascript
nginx实现多geoserver服务的负载均衡
2022/05/15 Servers