index.vue 817 Bytes
<template lang="pug">
  .play-audio
    audio(ref="audio" :src="mp3")
</template>
<script>
import mp3 from '@/assets/ding.mp3'
export default {
  name: 'PlayAudio',
  props: {
    mp3: {
      type: [String, Blob, null],
      default: mp3
    }
  },
  data() {
    return {
      audioStatus: 'pause',
      audioDuration: 0
    }
  },
  methods: {
    /**
     *  播放提示音
     * */
    playMusic() {
      if (this.audioStatus === 'pause') {
        this.$refs.audio.play()
        this.audioStatus = 'play'
      } else {
        this.$refs.audio.pause()
        this.$refs.audio.currentTime = 0
        this.audioStatus = 'pause'
      }
    }
  },
  mounted() {
    this.$refs.audio.addEventListener('ended', () => {
      this.$refs.audio.pause()
      this.audioStatus = 'pause'
    })
  }
}
</script>