vue播放报警音实现过程

由于项目需要，页面要发出报警音。
刚开始找了一个示例，是在watch里监听值改变，不过我运行了一下没有声音出现，所以还是记录一下成功实现的代码。
首先就是需要一段报警的mp3，对于网上免费的报警音资源，我是在这里下载的
https://hd1080.pro/?s=%E6%8A%A5%E8%AD%A6
然后将该段mp3放入文件夹中，放哪儿都可以，只要引用的时候能找到就行。我是和当前使用的文件放在同一级目录下

然后在html部分引入播放声音的标签

        <audio controls="controls" hidden src="./dd.mp3" ref="audio">audio>
		<el-button type="warning" icon="el-icon-edit"  @click="startplay">开始播放el-button>
1
2

然后创建函数去监控一下按钮，当点击按钮的时候就会播放报警音

    startplay(){ 
        this.$refs.audio.currentTime = 0; //从头开始播放提示音
        this.$refs.audio.play(); //播放
    }
1
2
3
4

接着保存运行，点击按钮就可以听到报警音了！