vuejs录音
Vue录音机 (vue-audio-recorder)
Audio recorder for Vue.js. It allows to create, play, download and store records on a server.
Vue.js的录音机。 它允许在服务器上创建,播放,下载和存储记录。
![vue-audio-recorder](https://i-blog.csdnimg.cn/blog_migrate/a9cccf30394ec3cfbaeff3f3abbdcf82.png)
特征 (Features)
Beautiful clean UI
美丽干净的用户界面
Download/upload/play record
下载/上传/播放记录
Time limit
时限
Records limit
记录限制
A lot of callbacks
很多回调
经过测试 (Tested in)
Chrome
Chrome
Firefox
火狐浏览器
Safari
苹果浏览器
安装 (Installation)
npm i vue-audio-recorder --save
道具 (Props)
Prop | Type | Description |
---|---|---|
attempts | Number | Number of recording attempts |
time | Number | Time limit for record in minutes |
upload-url | String | URL for uploading |
start-record | Function | It fires after click the record button |
stop-record | Function | It fires after click the stop button or exceeding the time limit |
start-upload | Function | It fires after start uploading |
attempts-limit | Function | It fires after exceeding the attempts |
failed-upload | Function | Is fires after failure uploading |
mic-failed | Function | It fires if your microphone doesn't work |
successful-upload | Function | It fires after successful uploading |
successful-upload-msg | String | Display the message after successful uploading |
failed-upload-msg | String | Display the message after failure uploading |
Struts | 类型 | 描述 |
---|---|---|
尝试 | 数 | 记录尝试次数 |
时间 | 数 | 记录时间限制(以分钟为单位) |
上传网址 | 串 | 上传网址 |
开始记录 | 功能 | 单击“记录”按钮后触发 |
停止记录 | 功能 | 单击停止按钮或超过时间限制后会触发 |
启动上传 | 功能 | 开始上传后会触发 |
尝试限制 | 功能 | 超过尝试次数后会开火 |
上传失败 | 功能 | 上传失败后会引发火灾 |
麦克风故障 | 功能 | 如果您的麦克风无法工作,则会触发 |
成功上传 | 功能 | 成功上传后触发 |
成功上传消息 | 串 | 成功上传后显示消息 |
失败上传消息 | 串 | 上传失败后显示消息 |
用法 (Usage)
<audio-recorder
upload-url="YOUR_API_URL"
:attempts="3"
:time="2"
:start-record="callback"
:stop-record="callback"
:start-upload="callback"
:successful-upload="callback"
:failed-upload="callback"/>
构建设置 (Build Setup)
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build
翻译自: https://vuejsexamples.com/a-simple-audio-recorder-for-vuejs-applications/
vuejs录音