1：首先把我们的静态资源文件加入到前端工程项目当中
我这里mp3文件就是要播报的语言文件
2： 页面中加入标签
<!-- src 后面的链接是我保存在static文件下的一段报警声 -->
<audio v-show="false" id="audioSuccessIn" src="/static/successIn.mp3"/>
<audio v-show="false" id="audioFalseIn" src="/static/falseIn.mp3"/>
<audio v-show="false" id="audioSuccessOut" src="/static/successOut.mp3"/>
<audio v-show="false" id="audioFalseOut" src="/static/falseOut.mp3"/>
3： 在相应的方法的后面调用我们的函数即可
在method里面对应的方法里面进行调用即可。
goodsDetailInOutSave(this.json)
.then(res => {
this.detailFormVisible = false
this.loading = false
if (res.success) {
this.getdata(this.formInline)
this.$message({
type: 'success',
message: '商品出入库成功！'
})
if(this.inOrOut===1){
this.playaudio('audioSuccessIn')
}else if(this.inOrOut===2){
this.playaudio('audioSuccessOut')
}
} else {
this.$message({
type: 'info',
message: res.msg
})
if(this.inOrOut===1){
this.playaudio('audioFalseIn')
}else if(this.inOrOut===2){
this.playaudio('audioFalseOut')
}
}
})
.catch(err => {
// this.goodsNumEditVisible = false
this.loading = false
this.$message.error('商品出入库失败，请稍后再试！')
})
},
到此这篇关于vue中添加语音播报功能的实现的文章就介绍到这了,更多相关vue 添加语音播报内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网！
