为什么没有官方人员应答呢,问题我阐述得很清楚了,demo也是给了的,到底是小程序的问题,还是我代码实现的问题,总该给给说法吧
InnerAudioContext实例触发stop函数,订阅者没有及时响应- 当前 Bug 的表现(可附上截图) 流程:demo中使用全局innerAudioContext实例,每次点击播放按钮都会触发点击事件函数play,play函数中,会首先判断当前innerAudioContext实例下是否有正在播放的音频,如果有,则调用innerAudioContext.stop()函数停止播放,然后再替换新的音频地址后重新播放。 bug:点击播放按钮后,如果新的音频地址与旧的音频地址相同,stop事件的订阅能正常触发。但是如果新的音频地址与旧的音频地址不同,stop事件的订阅要等到新音频播放完毕后才触发。点击多轮播放按钮,中间偶尔会触发stop事件的订阅。 [图片] - 预期表现 - 复现路径 - 提供一个最简复现 Demo wxml: <view> <view wx:for="{{ musicArr }}" wx:key="{{ index }}"> <view class="music-item"> <text>{{ item.name }}</text> <text>{{ item.isPlaying ? '播放中' : '停止' }}</text> <button catchtap="play" data-item="{{ item }}">播放</button> </view> </view> </view> js: const innerAudioContext = wx.createInnerAudioContext() Page({ /** * 页面的初始数据 */ data: { musicArr: [ { id: 1, name: '僕らの戦場live', path: '/assets/music/僕らの戦場live.mp3', isPlaying: false }, { id: 2, name: 'You Say Run', path: '/assets/music/You Say Run.mp3', isPlaying: false }, { id: 3, name: 'BRAVER', path: '/assets/music/BRAVER.mp3', isPlaying: false } ] }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { // 事件订阅 innerAudioContext.onPlay(()=> { console.log('onPlay') }); innerAudioContext.onStop(() => { console.log('onStop') // this.updateStopStatus() }); innerAudioContext.onEnded(() => { console.log('onEnded') this.updateStopStatus() }); }, /** * 播放 */ play(e) { // 如果有播放中的音频,则停止 if (!innerAudioContext.paused) { innerAudioContext.stop() // 由于stop订阅无法正常触发,故写在此 this.updateStopStatus() } innerAudioContext.autoplay = true innerAudioContext.src = e.currentTarget.dataset.item['path'] let index; this.data.musicArr.forEach((item, i) => { if (item.id === e.currentTarget.dataset.item['id']) { index = i } }) const up = "musicArr[" + index + "].isPlaying" this.setData({ [up]: true }) innerAudioContext.play() }, /** * 将所有音频状态更新为停止 */ updateStopStatus() { const musicArr = this.data.musicArr musicArr.forEach((item, i) => { item.isPlaying = false }) this.setData({ musicArr }) }, })
2018-12-18