<template>
  <div>
    <audio ref="audioPlayer" controls>
      <source :src="`${realSrc}`" type="audio/mp3">
    </audio>
  </div>
</template>

<script>
import {isExternal} from "@/utils/validate";

export default {
  props: {
    audioSrc: {
      type: String,
      required: true
    }
  },
  /*mounted() {
    this.$refs.audioPlayer.load();
  },*/
  computed:{
    realSrc() {
      if (!this.audioSrc) {
        return;
      }

      this.$nextTick(() => {
        this.$refs.audioPlayer.load();
      })

      let real_src = this.audioSrc.split(",")[0];
      if (isExternal(real_src)) {
        return real_src;
      }
      return process.env.VUE_APP_BASE_API + real_src;
    }
  },
  methods: {
    // 暂停 播放
    pausePlay() {
      this.$refs.audioPlayer.pause();
    }
  }
}
</script>
