benz-amr-recorder 前端解析播放amr格式音频

技术栈为vue+ts

依赖地址: www.npmjs.com/package/ben… 需要熟悉一下它的方法

主要是多个音频地址 然后需要切换播放 但是benz-amr-recorder 好像只能一个一个init 如果重复点的话会init出n个播放标签

```
<div class="audio-group" v-for="(item,index) in emergencyRecordings" :key="index">
  <span class="green-icon"></span>
  <span class="audio-number">录音文件{{index+1}}</span>
  <div class="audio-box" @click="audioPlay(item.id,item)">
    <img v-if="audioGifShow&&curRecordingIndex==item.id" class="audio-icon" src="@/assets/images/serviceInfo/icon_audio.gif">
    <img  v-else class="audio-icon" src="@/assets/images/serviceInfo/icon_audio.png">
    <span>{{timeformmat(item.duration)}}</span>
  </div>
  <audio :id="'recordingAudio'+index"  >
    <source :src="item.url" type="audio/ogg">
  </audio>
</div>
```



//下载引入依赖
const BenzAMRRecorder=require('benz-amr-recorder')
```
```
//处理方法 

audioPlay(index:number,item:RecordingParams){
  this.adudioMap.forEach((it,i)=>{
    console.log(it,item,i)
   if(i!==item.id) it.stop()
  })
  this.curRecordingIndex=index;
  console.log(item)
  let amr = this.adudioMap.has(index)?this.adudioMap.get(index):new BenzAMRRecorder();
//主要是多个音频地址 然后需要切换播放 但是好像只能一个一个init 播放 
  if(amr.isInit()) {
    if(amr.isPlaying()){
      amr.stop();
      this.audioGifShow=false;
    } else {
      this.audioGifShow=true;
      amr.play();
    }
    return
  }
  if (!item.url)return;
  amr.initWithUrl(item.url).then(()=>{
    amr.play();
    this.audioGifShow=true;
    this.adudioMap.set(index,amr)
  })
  amr.onAutoEnded(()=> {
    this.audioGifShow=false;
  });

}
```