官方解释是解码发生了错误，当是我对音频文件进行转码后并未解决这个问题，但是我想到解决方案是使用audio 标签，但是样式又非常丑自能选择自己写，然后又出现个问题audio标签获取不了播放音频总时长，差点没缓过气来。。。最后苦思冥想到了解决方案，使用video标签获取播放音频时长audio标签播放音频，最终还是解决了。

代码实现

    HTML

        这里使用ui组件是uview组件库

                进度条组件 u-slider 操作播放进度

	<view class="audio_box" v-for="(item,index) in detail.audio" :key="index">
						<view class="title_top">
							<view>景区指南</view>
							<view style="font-size: 24rpx;font-weight: 400;">
								<text style="font-size: 24rpx;font-weight: 400;">真人讲解</text>
								<text style="color: #EBEBEB;margin: 0 16rpx;">|</text>
								<text>随用随听</text>
							</view>
						</view>
						<view style="margin-top: 40rpx;">
							<video class="hidden" :src="item.url" :id="`myVideo${index}`"
								@loadedmetadata="(evet)=>loadedmetadata(evet,index)"
								></video> 
							<audio :id="`myAudio${index}`" @timeupdate="(evet)=>timeupdate(evet,index)" class="hidden" :src="item.url"></audio>
							
							<u-slider v-model="audioArray[index].sliderValue" active-color="#00CCB1"
								@start="onSlide('start',index)" @end="onSlide('end',index)"></u-slider>
							<view class="progress_time_box">
								<text>{
   
   {audioArray[index].payTime || '00:00'}}</text>
								<text v-if="audioArray[index].finalTime">{
   
   {audioArray[index].finalTime}}</text>
								<u-loadmore v-else :icon="true" :loadText="{loading:'加载中',loadmore:'加载中'}" />
							</view>
							<view style="text-align: center;" @click="()=> onPlayAudio(index)">
								<image v-if="audioArray[index].playSwitchIcon" class="pay_button"
									src="../../static/images/annualCard_img/[email protected]" />
								<image v-else class="pay_button"
									src="../../static/images/annualCard_img/[email protected]" />
							</view>
						</view>
					</view>

JS

转换播放时间为秒

function calcTimer(timer) { // 将毫秒转换为时间格式
		if (timer === 0 || typeof timer !== 'number') return '00:00';
		let mm = Math.floor(timer / 60);
		let ss = Math.floor(timer % 60);
		if (mm < 10) mm = '0' + mm;
		if (ss < 10) ss = '0' + ss;
		return mm + ':' + ss;
	}

1.获取文件播放总时长

loadedmetadata(evet, index) { // 立即获取音频时间
				const str = calcTimer(evet.detail.duration);
				this.audioArray[index] = {
					duration: evet.detail.duration,//播放时间总时长
					finalTime: str,//播放时间总时长(展示时间)
					playSwitchIcon: false,//切换播放音频图片
					sliderValue: 0//播放音频进度条
				};
				console.log(this.audioArray,'this.audioArray')
				this.$forceUpdate();
			}

2.点击播放

onPlayAudio(index) { // 点击开始播放
                //由于我这个是遍历出来需要获取下标来确认每个标签 可以仔细查看HTML片段
				const { pause, play } = uni.createAudioContext(`myAudio${index}`)
				this.audioArray[index].playSwitchIcon ? pause() : play(); //开始播放 和 暂停播放
				this.audioArray[index].playSwitchIcon = !this.audioArray[index].playSwitchIcon; //切换播放图标
				this.$forceUpdate()
			},

3.开始播放音频

timeupdate(evet, index) { // 播放开始了
				const current = evet.detail.currentTime,
					str = calcTimer(current),
					result = (Math.round(Math.floor(current) / Math.floor(evet.detail.duration) * 10000) / 100);//转换播放时间为秒
				this.audioArray[index].sliderValue = Number(result) || 0;//更新当前进度条时间
				this.audioArray[index].payTime = str; //更新当前播放音频时间
				this.$forceUpdate();
				if (str === this.audioArray[index].finalTime) {
					// 播放时间和获取的时间相等了就自动关闭
					this.audioArray[index].playSwitchIcon = false;
				}
			}

4.滑动进度条组件，调整播放进度

onSlide(type, index) { // 滑动调整播放时间
				const { pause, play, seek } = uni.createAudioContext(`myAudio${index}`);
				if (type === 'start') {
					pause(); //滑动开始暂停
					this.audioArray[index].playSwitchIcon = false;
				} else {
					seek(this.audioArray[index].sliderValue / 100 * this.audioArray[index].duration); // 总时长除以现在的进度
					play(); //滑动结束后播放
					this.audioArray[index].playSwitchIcon = true;
				}
			}

写的一般还请有大佬指点一二