更新记录

1.0.0（2020-09-10） 下载此版本

v1.0.0

平台兼容性

插件使用说明

  • 最近有个项目需要用到audio标签,我用了原生的audio标签发现在h5端正常,在APP端却不显示,
  • 这个让我头疼半天,还以为是其他的问题。最后我在插件市场找到了作者luch开发的这款插件,
  • 在h5端正常,在APP端会出现TypeError: Attempted to assign to readonly property.
  • TypeError: Cannot read property 'isPaused' of undefined 等问题。
  • 基于 luch 封装audio音频组件进行了少许修改,APP端正常。感谢luch
  • 支持双向绑定
  • 支持自定义修改样式

Example

<luch-audio src="https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/music.mp3" :play.sync="audioPlay"></luch-audio>

// 控制变量audioPlay ，如果true音频会播放，否则暂停

Attributes

参数 说明 类型 可选值 默认值 required
play 是否播放,双向绑定，需加 .sync Boolean — — true
src 资源路径 String — — —
poster 封面图片路径 String — — —
name 音频名称 String — 未知音频 —
author 作者名字 String — 未知作者 —
autoplay 是否自动开始播放 Boolean — false —
loop 是否循环播放 Boolean — false —
obeyMuteSwitch 是否遵循系统静音开关，当此参数为 false 时，即使用户打开了静音开关，也能继续发出声音 Boolean — true —

其他api 可在组件内 contextInit 函数初始化时自定义添加

平台支持度

5+App H5 微信小程序 支付宝小程序 百度小程序 头条小程序
yes yes yes no yes yes

注意：以上平台支持度为uni-app 对uni.createInnerAudioContext() api 的支持度，本组件的支持度本人只在微信小程序使用过，其他平台未做测试

使用

下载后把该文件放至 components 文件夹或 特定平台组件 文件夹即可

更新

  • v0.0.1 组件

可扩展性

api 增加参考 https://uniapp.dcloud.io/api/media/audio-context?id=createinneraudiocontext
组件内的播放暂停图标本人因为要发布组件，所以使用了base64,大家可自行替换；
实例获取可以通过ref 获取组件内的 innerAudioContext （未实验，只是估计 0.0）

说明

切换src 或者切换页面都会销毁实例
写本组件的原因就是原生audio组件无法修改宽度，导致某些情况下显示不全，本组件是100%自适应布局；

隐私、权限声明

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

无

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

无

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

无

许可协议

MIT协议
评论列表 撰写评论 向官方投诉
加载更多...