当前位置: 首页 > news >正文

uniapp录音播放功能

在这里插入图片描述
ui效果如上。
播放就开始倒计时,并且改变播放icon,另外录音则停止上一次录音。
播放按钮(三角形)是播放功能,两竖是暂停播放功能。

	const innerAudioContext = wx.createInnerAudioContext();export default{data(){return{recordingList:[],playIndex:null,//播放、暂停标识recordingTime:null,//倒计时copyIndex:null,//显示倒计时标识}},onLoad(option) {this.init()},onHide() {this.recordingInit()innerAudioContext.stop()//后退、后台页面停止音频,用销毁destroy重新进来onError会报错-1},onUnload() {this.recordingInit()innerAudioContext.stop()},methods:{//初始化列表,上拉下拉根据项目做init(){this.recordingList = []this.getRecordingList()},//获取订单录音列表getRecordingList(){let list = [{download_url:'',call_time_duration:13,//录音时长call_time_duration_copy:13,//复制录音时长,倒计时要用}]this.recordingList = list},//播放recordingPlay(item,index){if(this.playIndex != index){this.playIndex = indexif(this.copyIndex != index){//判断是继续播放还是播放另外一个,播放另外一个重新赋值this.copyIndex = indexitem.call_time_duration_copy = JSON.parse(JSON.stringify(item.call_time_duration))}clearInterval(this.recordingTime)//即便ios开启静音模式,也可以播放wx.setInnerAudioOption({obeyMuteSwitch: false})innerAudioContext.src = item.download_urlinnerAudioContext.play();//监听错误innerAudioContext.onError((res) => {console.log('监听错误',res)this.recordingInit()innerAudioContext.stop()});//监听播放结束innerAudioContext.onEnded((res) => {this.recordingInit()item.call_time_duration_copy = JSON.parse(JSON.stringify(item.call_time_duration))});this.recordingTime = setInterval(()=>{if(item.call_time_duration_copy <= 0){clearInterval(this.recordingTime)}else{item.call_time_duration_copy--;}},1000)}},//暂停recordingPause(){this.recordingInit()},//播放初始化recordingInit(){this.playIndex = nullinnerAudioContext.pause();clearInterval(this.recordingTime)}}}
http://www.lryc.cn/news/370013.html

相关文章:

  • ✊构建浏览器工作原理知识体系(网络协议篇)
  • 【AI大模型】Transformers大模型库(八):大模型微调之LoraConfig
  • 8-1RT-Thread消息队列
  • 解除网站IP抓取限制的方法有哪些?
  • “手撕”二叉树的OJ习题
  • Linux Mint 21.3简介
  • C++11 面试题整理
  • 【智能制造-2】焊缝跟踪
  • 优思学院|用ChatGPT快速完成数据分析图表【柏累托图法】
  • [晕事]今天做了件晕事37 extern “C“ 被认为了是外部函数
  • 问题:关于醋酸钠的结构,下列说法错误的是() #媒体#媒体
  • 网络安全(补充)
  • Redis集群(3)
  • 防止Selenium被检测 Google Chrome 125
  • LeetCode 算法:螺旋矩阵c++
  • 【全开源】医护上门系统小程序APP公众号h5源码
  • 结构体<C语言>
  • 点云分割报告整理(未完成版-每天写一点)
  • python基础 002 - 1 基础语法
  • 浅谈Web开发的三大主流框架:Angular、React和Vue.js
  • 使用net.sf.mpxj读取project的.mpp文件
  • ubuntu 22.04 升级到24.04
  • FreeRTOS学习笔记-基于stm32(14)内存管理
  • 关于Lambert W函数
  • 【免杀】C2远控-APC注入-进程镂空
  • 20240611 讯飞JAVA工程师(研发经理岗)面试
  • 【研发日记】Matlab/Simulink软件优化(三)——利用NaNFlag为数据处理算法降阶
  • go语言接口之http.Handler接口
  • R语言 | 使用最简单方法添加显著性ggpubr包
  • 【Linux】shell脚本变量——系统变量、环境变量和用户自定义变量