yo-aduio-player-vue2 v0.0.1

audio-player

可组合控制按钮 音乐播放器

引用

// 单组件引用
import { AudioPlayer } from 'yo-audio-player'
import 'yo-audio-player/lib/style.css'

// main.js 全局引入
import AudioPlayer from 'yo-audio-player'
import 'yo-audio-player/lib/style.css'
app.use(AudioPlayer)

使用示例

<template>
  <AudioPlayer
    :controls="['play', 'timer', 'progress','volume', 'speed', 'download', 'slot']"
    src="http://attachment.0sm.com/node0/2024/06/866612DDA5B260F7-e9233f91f555a1ee.mp3"
    ref="playerRef"
  >
    <template #slot="{ play, playing }">
      <button @click="play">slot 按钮</button>
    </template>
  </AudioPlayer>
  <br>
  <br>
  <button @click="index = 0">音乐1</button>
  <button @click="index = 1">音乐2</button>
  <button @click="handleTest(true)">播放</button>
  <button @click="handleTest(false)">暂停</button>
  <button @click="handleSetSpeed()">设置3x速度</button>
  <button @click="handleSetVolume()">设置音量90%</button>
</template>
<script>
  import { AudioPlayer } from 'yo-audio-player'
  export default {
    components: {
      AudioPlayer
    }
  }

Player 属性

Player Events 方法

Player Exposes

Player slots 属性及方法