微信小程序之音频播放-wx.createInnerAudioContext()注意点

咱们先看看官方示例

地址：https://mp.weixin.qq.com/debug/wxadoc/dev/api/createInnerAudioContext.html

 

创建innerAudioContext 对象。

autoplay自动播放开启，

src音频路径

onPlay()以及onError()播放以及错误回调。

以上理解的不难懂。

 

那么问题来。大部分人都会直接运用在自己需要的事件中。比如：

Page外：

 

const innerAudioContext = wx.createInnerAudioContext()

 

Page内：

 

audioPlay: function() {

        innerAudioContext.src = 'xxx';

        innerAudioContext.play();

 

 

        innerAudioContext.onPlay(() => {

            console.log('录音播放中');

        })

 

        innerAudioContext.onStop(() => {

            console.log('录音播放停止');

        })

 

        innerAudioContext.onEnded(() => {

            console.log('录音播放结束');

        })

 

  }

})

直接触发audioPlay方法 简单粗暴是不

结果发现。innerAudioContext.onPlay()，innerAudioContext.onStop()，innerAudioContext.onEnded(),播放停止多少次，就会叠加回调。

意外不意外。惊喜不惊喜。

其实不是官方误导我们，而是我们理解错了 

回调事件，是每一次触发都会注册一次。

也就是这个事件触发过一次。这个回调就已经一直存在了。所以不需要一直去创建回调事件。

那么应该怎么做呢~

 

只需要把所有的回调写在onLoad中即可。页面加载即注册监听事件，小程序中即使定义了全局变量，事件绑定也不会覆盖，只会加注册多一个线程监听

 

控制播放在其他事件进行即可。回调只需要在onLoad中注册就可以了