浅析wavesurfer.js中的各大监听事件

前言：vue中嵌入使用wavesurfer.js的教程详见：https://blog.csdn.net/zrcj0706/article/details/104635357

1、在使用wavesurfer.js插件时，可以设置各种监听事件，比如播放完毕触发什么方法，设置静音时触发什么方法等等，该插件官网有自定义好的各大事件的识别，只需要使用on方法设置监听即可，如下代码：

//音频暂停时的监听事件
wavesurfer.on('pause', function () {
    wavesurfer.params.container.style.opacity = 0.9;//识别到监听事件后，需要执行的操作
});

2、官网为我们准备的课直接使用的监听事件

audioprocess–音频播放时连续发射。搜寻时也会触发。
dblclick –双击实例时。
destroy –实例被销毁时。
error–发生错误。回调将收到（字符串）错误消息。
finish –完成播放时。
interaction –与波形有相互作用时。
loading–使用抓取或拖放加载时连续触发。回调将以百分比[0..100]接收（整数）加载进度。
mute–静音更改。回调将收到（布尔）新的静音状态。
pause –音频暂停时。
play –播放开始时。
ready–加载，解码和绘制音频时，会显示音频。使用MediaElement时会在绘制波形之前触发，请参见waveform-ready。
scroll-移动滚动条时。回调将收到一个ScrollEvent对象。
seek–在寻求。回调将收到（浮动）进度[0..1]。
volume–音量变化时。回调将收到（整数）新音量。
waveform-ready–使用MediaElement后端时，在绘制波形后触发。如果您使用的是WebAudio后端，则可以使用ready。
zoom–缩放时。回调将收到（整数）minPxPerSec。