Version: next

Audio

音频。1.6.0版本开始,该组件不再维护。建议使用能力更强的 Taro.createInnerAudioContext 接口

参考文档

类型

ComponentType<AudioProps>

示例代码

export default class PageView extends Component {
constructor() {
super(...arguments)
}
render() {
return (
<View className='components-page'>
<Audio
src='https://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E06DCBDC9AB7C49FD713D632D313AC4858BACB8DDD29067D3C601481D36E62053BF8DFEAF74C0A5CCFADD6471160CAF3E6A&fromtag=46'
controls={true}
autoplay={false}
loop={false}
muted={true}
initialTime='30'
id='video'
/>
</View>
)
}
}

AudioProps

参数类型默认值必填说明
id
string
audio 组件的唯一标识符
src
string
要播放音频的资源地址
loop
boolean
false
是否循环播放
muted
boolean
false
是否静音播放
不推荐使用
controls
boolean
false
是否显示默认控件
poster
string
默认控件上的音频封面的图片资源地址,如果 controls 属性值为 false 则设置 poster 无效
name
string
"未知音频"
默认控件上的音频名字,如果 controls 属性值为 false 则设置 name 无效
author
string
"未知作者"
默认控件上的作者名字,如果 controls 属性值为 false 则设置 author 无效
onError
BaseEventOrigFunction<onErrorEventDetail>
当发生错误时触发 error 事件,detail = {errMsg: MediaError.code}
onPlay
BaseEventOrigFunction<any>
当开始/继续播放时触发play事件
onPause
BaseEventOrigFunction<any>
当暂停播放时触发 pause 事件
onTimeUpdate
BaseEventOrigFunction<onTimeUpdateEventDetail>
当播放进度改变时触发 timeupdate 事件,detail = {currentTime, duration}
onEnded
BaseEventOrigFunction<any>
当播放到末尾时触发 ended 事件

API 支持度

API微信小程序百度小程序H5React Native
AudioProps.id✔️
AudioProps.src✔️✔️✔️
AudioProps.loop✔️✔️✔️
AudioProps.muted✔️
AudioProps.controls✔️✔️✔️
AudioProps.poster✔️✔️
AudioProps.name✔️
AudioProps.author✔️
AudioProps.onError✔️✔️✔️
AudioProps.onPlay✔️✔️✔️
AudioProps.onPause✔️✔️✔️
AudioProps.onTimeUpdate✔️✔️✔️
AudioProps.onEnded✔️✔️✔️

onErrorEventDetail

参数类型
errMsg
1 | 2 | 3 | 4

onTimeUpdateEventDetail

参数类型说明
currentTime
number
当前时间
duration
number
持续时间

MediaError

code

参数说明
1获取资源被用户禁止
2网络错误
3解码错误
4不合适资源

API 支持度

API微信小程序百度小程序H5React Native
Audio✔️✔️✔️