vue-audio-player在vue3中如何引入使用

在Vue3中使用`vue-audio-player`插件，你需要按照以下步骤操作：

1. **安装依赖**:
首先，在你的项目目录中打开终端（命令行），使用npm或yarn来安装`vue-audio-player`。如果是npm，运行：

   npm install vue-audio-player --save

或者使用yarn：

   yarn add vue-audio-player

2. **引入组件**:
在`.vue`文件或全局样式中，你可以像导入其他Vue组件一样导入`AudioPlayer`组件：

   <script setup>
   import { AudioPlayer } from "vue-audio-player";
   </script>

3. **使用组件**:
在模板中，将`AudioPlayer`组件添加到需要的地方，并传递音频源和其他配置选项，比如：

   <template>
     <div>
       <audio-player src="path/to/audio.mp3"
                     :controls
                     @ready="playerReady"
                     @playing="playerPlaying"
                     @pause="playerPaused"
         />
     </div>
   </template>

   <script>
   import AudioPlayer from 'vue-audio-player';

   const playerReady = () => {
     console.log('Player is ready');
   };

   const playerPlaying = () => {
     console.log('Player started playing');
   };

   const playerPaused = () => {
     console.log('Player paused');
   };

   onMounted(() => {
     // 如果需要，可以在这里初始化音频播放器
   });
   </script>

4. **注册全局组件** (可选):
如果你想在整个应用中都能使用这个组件，可以在`main.js`或其他合适的地方注册它：

   import { createApp } from 'vue';
   import App from './App.vue';
   import AudioPlayer from 'vue-audio-player';

   createApp(App)
     .component('AudioPlayer', AudioPlayer)
     .mount('#app');