舞蹈分页

闫增涛

2024-06-05 3fb594dc317848107fd7bbb51631cfb763c19f5f

 src/components/miniAudio/index.vue

@@ -1,24 +1,62 @@
<template>
  <div class="mini-audio" v-if="path">
    <audio controls :src="path"></audio>
    <audio controls :src="path" class="aduioPlayer"></audio>
  </div>
</template>

<script>
  export default {
    name:"mini-audio",
    props:{
      path:{
        type:String
export default {
  name: "mini-audio",
  props: {
    path: {
      type: String,
    },
    currentTime: {
      type: Number,
    },
  },
  watch: {
    path: {
      handler(newVal) {
        if (newVal) {
          setImmediate(() => {
            this.play();
          }, 200);
        }
      },
    },
  },
  methods: {
    play() {
      const player = (this.container ? this.container : document).querySelector(
        ".aduioPlayer"
      );
      if (player) {
        player.currentTime = this.currentTime;
        player.play();
      }
    }
  }
    },
    getVideoPlayer() {
      let obj = null;
      const player = (this.container ? this.container : document).querySelector(
        ".aduioPlayer"
      );
      if (player) {
        obj = {
          currentTime: player.currentTime,
          paused: player.paused,
        };
      }
      return obj
    },
  },
};
</script>

<style lang="less" scoped>
.mini-audio {
  position: fixed;
  right:40px;
  right: 40px;
  bottom: 100px;
}
</style>
</style>