更新记录

1.0.0(2025-02-08) 下载此版本

1.0版本,亲测可用。


平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
app-vue
钉钉小程序 快手小程序 飞书小程序 京东小程序 鸿蒙元服务
×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

插件作用和优势

由于最近在研究AI,在做一款文字转语音功能,在转换完毕后进行播放的时候发现怎么都找不到合适的音频播放插件,这让有强迫症的我很是头疼,结果一生气自己做一个出来算了。

1.采用原生uni.createInnerAudioContext开发,目前在uniapp的世界里几乎是最优解。
2.优化了采用uni.createInnerAudioContext开发时所面临的技术难题,比如在一个按钮同时兼具播放/暂停功能的同时还要同时支持多次反复切换音频播放会导致出现-99错误等。
3.源码简单易懂,很容易二次开发,做出自己想要的风格。
4.完美兼容vue2和vue3,这是为数不多的。

使用方法

  1. 一键导入到您的项目中,默认目录:uni_modules
  2. 在要使用的页面中直接使用:
<template>
    <view class="index-box">
        <zmt-audio :audio="audio" @onPlay="onPlay"></zmt-audio>
    </view>

</template>

完整实例代码

<template>
    <view class="index-box">
        <zmt-audio :audio="audio" @onPlay="onPlay"></zmt-audio>
    </view>
</template> 

<script> 
    export default {
        data() {
            return {
                audio:{
                    poster:'./static/images/defualt_poster.png',//封面地址
                    url:'音乐文件地址',
                    autoPlay:false,//是否自动播放
                    loop:false//是否循环播放
                }
            }
        },

        methods: {
            //音频播放事件
            onPlay(e){
                console.log('播放开始',e);
            }
        }
    }
</script>

音频播放事件

事件名 作用 返回值 特殊说明
onPlay 开始播放时触发 true 代表开始播放
onPause 暂停播放时触发 true 代表已暂停播放
onTimeUpdate 播放过程实时触发 当前播放的时间(秒) 主要根据此结果处理进度条
onEnded 自然播放结束后触发 true 代表自然播放结束

隐私、权限声明

1. 本插件需要申请的系统权限列表:

下载需要申请访问手机空间权限。

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问