vue自定义音频播放组件
音频更好 (vue-audio-better)
Easy to create custom audio player components for Vue.js.
易于为Vue.js创建自定义音频播放器组件。
安装 (Installation)
npm install vue-audio-better --save
更新资料 (Update)
Add animation...
添加动画...
建立 (Setup)
捆绑器(Webpack,汇总) (Bundler (Webpack, Rollup))
// in your entrypointimport Vue from 'vue'import VueAudio from 'vue-audio-better'Vue.use(VueAudio)
用法 (Usage)
必填标记 (Required Markup)
<vue-video:src="/some_audio.mp3"></vue-video>
道具 (Props)
width
(width
)
Type:Number
- Default:500
类型:Number
-默认值:500
Audio width
音讯宽度
source
(source
)
Type:String
- Required
类型:String
-必填
An string of audio file url
音频文件网址字符串
html5
(html5
)
Type:Boolean
- Default:false
类型:Boolean
-默认值:false
Whether to force HTML5 Audio
是否强制使用HTML5音频
loop
(loop
)
Type:Boolean
- Default:false
类型:Boolean
-默认值:false
Whether to start the playback again automatically after it is done playing
播放完毕后是否自动重新开始播放
preload
(preload
)
Type:Boolean
- Default:true
类型:Boolean
-默认值:true
Whether to start downloading the audio file when the component is mounted
安装组件后是否开始下载音频文件
autoplay
(autoplay
)
Type:Boolean
- Default:false
类型:Boolean
-默认值:false
Whether to start the playback when the component is mounted
安装组件后是否开始播放
formats
(formats
)
Type:String[]
- Default:[]
类型:String[]
-默认值:[]
Howler.js automatically detects your file format from the extension, but you may also specify a format in situations where extraction won't work (such as with a SoundCloud stream)
Howler.js会自动从扩展名中检测文件格式,但是您也可以在无法提取的情况下指定格式(例如,使用SoundCloud流)
xhrWithCredentials
(xhrWithCredentials
)
Type:Boolean
- Default:false
类型:Boolean
-默认值:false
Whether to enable thewithCredentials
flag on XHR requests used to fetch audio files when using Web Audio API (see reference)
使用Web Audio API时是否在用于获取音频文件的XHR请求上启用withCredentials
标志( 请参阅参考资料 )
发展历程 (Development)
建立 (Build)
Bundle the js to thedist
folder:
将js绑定到dist
文件夹:
npm run build
致谢 (Acknowledgements)
howler.js vue-howler
howler.js vue- howler
翻译自: /easy-to-create-custom-audio-player-components-for-vue/
vue自定义音频播放组件