1、初始化一个音乐实例 2、将这个初始化的方法添加到全局 3、封装组件写好样式 4、调用我们放在全局的init方法 通过proxy 可以在vue3中那个我们配置在全局的方法 此时a就是我们获取到的音频实例，并且设置了我们需要播放的音频链接 5、接下来就是我们可能用到的一些API的介绍 startTime                开始播放的位置autoplay      是否自动开始播放，默认为falseloop是否循环播放，默认为falseduration                当前音频的长度是通过src中音频返回的，需要在onCanplay中获取currentTime       当前音频的播放位置paused当前是否为暂停或停止状态 true为暂停或停止，false表示正在播放 6、需要使用到的方法 play播放pause暂停seek跳转到指定位置 sonCanplay音频可以进入播放状态stop停止 7、创建音频 这一步设置一些关于播放的配置，例如是否自动播放，但是最重要的是获取我们时长，但是我在使用的时候发现直接获取duration的时候无法成功获取到，通过百度发现了下面的方法，通过设置定时器。 因为音乐播放时长的展示形式一般为 00:00 形式的，而我们获取的时长是以s为单位结束的所以还需要将时间进行格式化处理  8、完成播放和暂停功能 定义一个方法用于控制音频的播放和暂停，isPlay是用于控制我们按钮切换的状态，playTime就是当前播放时长，trueTime也是总时长 9、进度条设置 直接使用uni-app的内置组件slider就可以实现进度条的效果 slider的value属性需要传的是数字，进度条的最大值为100 我们可以使用(data.playTime / data.trueTime) * 100 计算当前的时长 就是相当于将data.trueTime分成data.trueTime等份 通过sidler的change的方法控制进度条的拖动，并且改变音乐的进度 这里的second将就是将总时长播放到百分之几赋值给second 总结  到此这篇关于如何使用vue3+uni-app封装音乐播放插件的文章就介绍到这了,更多相关vue3 uni-app封装音乐播放插件内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！