vue中操作原生音频audio的播放和暂停

1.在methods中定义方法playAudio()

palyAudio(){
    this.audio = new Audio();
    this.audio.src = mp3;
    let playPromise; 
    playPromise = this.audio.play();
    if (playPromise) {
        playPromise.then(() => {
            // 音频加载成功
            // 音频的播放需要耗时
          that.tiemr = setInterval(() => {
            second--;
            if (second <= 0) {
              that.audio.pause()
              clearInterval(that.tiemr);
            }
          }, 1000);
        }).catch((e) => {
          // 音频加载失败
          console.error(e);
        });
      }
}

2.在哪里需要用就在哪里调用

// 重新加载
this.audio.load();
 
// 判断是否正在播放 返回布尔值
this.audio.paused
 
// 暂停
this.audio.pause();

3.如果需要一进入就播放的话,存放在mounted中调用

4.如果自定义audio组建的话将audio组件隐藏

你可能感兴趣的:(vue,html,vue.js)