2024年uni-app uni(1)，2024年最新物联网嵌入式开发端简单易用的SPI框架

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上物联网嵌入式知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、电子书籍、讲解视频，并且后续会持续更新

如果你需要这些资料，可以戳这里获取

解读:
如图所示这是一个音频播放页面，基本功能如下：播放暂停，快进快退，文件切换，当前文件播放结束自动播放下一个文件。

正文：
1.播放样式（文件切换样式我就不放了，就放个进度条这个）：

<view class="audio-container">
	<view class="audio-play" @tap="changePlayState">//暂停和播放事件
		<image class="image"  :src="audioPlay ? '暂停图片' : '播放图片'"></image>
	</view>
	<view class="audio-slider">
		<view class="audio-time">
			<text>{{currentTimeStr}}</text>//进度时间
		</view>
		//min进度从0开始 sliderMax进度最大值 sliderChangeComplate快进快退事件 sliderValue播放进度
		<slider class="slider" min="0" :max="sliderMax" @change="sliderChangeComplate" block-size="14"
		 :value="sliderValue" activeColor="blue"></slider>
		<view class="audio-time">
			<text>{{timeStr}}</text>//总时间
		</view>
	</view>
</view>

2.创建实例

//录音实例
creatAudio() {
	this.innerAudioContext = uni.createInnerAudioContext();//创建实例
	this.innerAudioContext.autoplay = true;//设置是否自动播放
	this.innerAudioContext.src = this.recordPath;//音频的url
	this.innerAudioContext.onPlay(() => {
		// 播放监听
		console.log('播放!');
		this.audioPlay = true;
	});
	this.innerAudioContext.onPause(() => {
		// 暂停监听
		console.log('暂停播放!');
		this.audioPlay = false

	});
	this.innerAudioContext.onEnded(() => {
	  // 结束播放监听
	  console.log('播放结束!');
	  this.audioPlay=false;
	  //自动切换事件
	  this.qeihuanwenjian()
	});
	this.innerAudioContext.onTimeUpdate(() => {
		const { currentTime,duration} = this.innerAudioContext;//这俩参数是这个api自带的参数
		
		const currTimeStr = this.formatTime(currentTime);
		this.sliderValue = parseInt(currentTime);
		
		// 变动的时间
		this.currentTimeStr = currTimeStr;
		
		//进度条最大值
		this.sliderMax = this.formatSecond(duration);
	});
},

3.点击暂停播发事件

// 录音暂停播放
changePlayState() {
	if (this.audioPlay == false) {
		this.innerAudioContext.play();
	} else {
		this.innerAudioContext.pause()
	}
},

4.快进快退

//音频前进回退
sliderChangeComplate(e) {
	const currTimeStr = this.formatTime(e.detail.value)
	this.currentTimeStr = currTimeStr
	this.innerAudioContext.seek(e.detail.value);
	this.innerAudioContext.play();
},

5.点击列表切换

// 文件切换播放
filechange(item, i) {
	this.innerAudioContext.destroy()
	this.csdFileindex=i;
	this.recordPath = item.recordPath;
	this.sliderMax = this.getTime(item.recordDuration);
	this.timeStr = this.getTime(item.recordDuration);
	this.creatAudio()
},


![img](https://img-blog.csdnimg.cn/img_convert/ba671c1e4734cbc6e63fb12f2fe2a3ab.png)
![img](https://img-blog.csdnimg.cn/img_convert/15456b7a0dc9bdb35f556d02896da2e7.png)

**既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上物联网嵌入式知识点，真正体系化！**

**由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、电子书籍、讲解视频，并且后续会持续更新**

**[如果你需要这些资料，可以戳这里获取](https://bbs.csdn.net/topics/618679757)**

*由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、电子书籍、讲解视频，并且后续会持续更新**

**[如果你需要这些资料，可以戳这里获取](https://bbs.csdn.net/topics/618679757)**