// pages/group/components/topicAudio/index.js const innerAudioContext = wx.createInnerAudioContext() Component({ /** * 组件的属性列表 */ properties: { url: { type: String, default: '' }, duration: { type: Number, default: 0 }, showDel: { type: Boolean, default: false } }, /** * 组件的初始数据 */ data: { totalTime: '', stepTime: 0, totalMax: 0, stepValue: 0, hasPlay: false, playUrl: '' }, async ready() { await this.downLoadAudio() console.log('readyyyyyy', this.data.playUrl) // this.initAudio() }, lifetimes: { detached() { innerAudioContext.stop() console.log('detached', innerAudioContext) }, }, /** * 组件的方法列表 */ methods: { initDuration() { let { totalTime, duration } = this.data if (duration) { totalTime = this.format(this.data.duration) this.setData({ totalTime, totalMax: duration }) } console.log('totalMax', this.data.totalMax) }, downLoadAudio() { wx.downloadFile({ url: this.data.url, //仅为示例,并非真实的资源 success: res => { // 只要服务器有响应数据,就会把响应内容写入文件并进入 success 回调,业务需要自行判断是否下载到了想要的内容 if (res.statusCode === 200) { console.log('res2222222', res) this.setData({ playUrl: res.tempFilePath }) this.initAudio() } else { wx.showToast({ title: '音频加载失败', icon: 'none', duration: 1500 }) } }, fail: () => { wx.showToast({ title: '音频加载失败', icon: 'none', duration: 1500 }) } }) }, initAudio () { innerAudioContext.src = this.data.playUrl innerAudioContext.autoplay = false this.initDuration() console.log('ppppplllaaa', innerAudioContext) innerAudioContext.onCanplay(() => { console.log('初始化播放', innerAudioContext.duration) }) innerAudioContext.onPlay(() => { console.log('开始播放', innerAudioContext.duration) }) innerAudioContext.onTimeUpdate(() => { console.log("duration-onTimeUpdate", innerAudioContext.duration); console.log("currentTime", innerAudioContext.currentTime); if (innerAudioContext.duration) { this.setData({ totalMax: (innerAudioContext.duration * 1000), }) } this.setData({ stepValue: (innerAudioContext.currentTime * 1000), // totalMax: (innerAudioContext.duration * 1000), // totalTime: this.format(innerAudioContext.duration * 1000), }) console.log('stepValue', this.data.stepValue) console.log('totalTime', this.data.totalTime) console.log('totalMax', this.data.totalMax) }); innerAudioContext.onEnded(() => { console.log("end"); this.setData({ hasPlay: false }) }); innerAudioContext.onError((res) => { console.log("errMsg", res.errMsg); wx.showToast({ title: res.errMsg, icon: 'none', duration: 1500 }) }); }, handleBtn() { let { hasPlay } = this.data if (hasPlay) this.audioPause() else this.audioPlay() }, audioPause() { innerAudioContext.pause() this.setData({ hasPlay: false }) }, audioPlay() { // if (innerAudioContext.currentTime) innerAudioContext.play() // else this.initAudio() innerAudioContext.play() this.setData({ hasPlay: true }) console.log('innerAudioContext', innerAudioContext) }, slideChange(e) { this.audioPause() let value = e.detail.value; console.log('slidechange', value) innerAudioContext.seek(value/1000) this.setData({ stepValue: value, }) // innerAudioContext.onSeeked(() => { // console.log('onSeeked', innerAudioContext.currentTime) // }) this.audioPlay() }, handleSlideMove(e) { // let value = e.detail.value; this.audioPause() // innerAudioContext.seek(value/1000) // innerAudioContext.onSeeking(() => { // console.log('onSeeking', innerAudioContext.currentTime) // this.setData({ // stepValue: value, // }) // }) }, handleAudioDel() { innerAudioContext.stop() // innerAudioContext.destroy() console.log('innerAudioContextdel', innerAudioContext) this.triggerEvent('audiodel') }, format(num) { let min = parseInt(num/1000/60) let second = parseInt(num/1000)%60 min = min >= 10 ? min : '0' + min second = second >= 10 ? second : '0' + second return min + ':' + second }, } })