// components/list-audio/list-audio.js import { CDN_URL,API_BASE_URL } from '../../config/index'; var AllExample = []; Component({ /** * 组件的属性列表 */ properties: { audio: { type: Object, value: {}, } }, /** * 组件的初始数据 */ data: { cdn_url:CDN_URL, durationTime: '00:00', currentTime: '00:00', isPlay: false, audioExample: null, progress: 0, allAudio: [], targetUrl:API_BASE_URL+'/data/' }, /** * 组件的方法列表 */ methods: { startMusic() { // 全部暂停 AllExample.forEach(simpleAudio => { simpleAudio.pause(); }) // this.data.audioExample.autoplay = true; // this.data.audioExample.src = this.data.targetUrl+this.properties.audio['audio']; // this.data.audioExample.play(); // this.setData({ // isPlay: true // }) this.data.audioExample.autoplay = true; this.data.audioExample.src = this.data.targetUrl+this.properties.audio['audio']; this.data.audioExample.play(); this.setData({ isPlay: true }) this.loadProgress() }, // 播放中 loadProgress() { this.data.audioExample.onCanplay((e) => { this.data.audioExample.duration; //必须写,不然获取不到。。。 var timer = setInterval(() => { // 只要音频暂停了,定时器(假的)不执行 if (this.data.audioExample.paused) return; var currentime = this.data.audioExample.currentTime; var duration = this.data.audioExample.duration; var currTimeStr = this.formatTime(currentime); var duraTimeStr = this.formatTime(duration); var progress = parseInt((this.data.audioExample.currentTime / this.data.audioExample.duration) * 100) if (progress === 100 || isNaN(this.data.progress)) { clearInterval(timer) this.setData({ isPlay: false, progress: 0, currentTime: "00:00", }) } else { this.setData({ progress, currentTime: currTimeStr, durationTime: duraTimeStr }) } }, 1000); }); }, stopMusic() { this.data.audioExample.pause(); this.setData({ isPlay: false }) }, formatTime: function (num) { //格式化时间格式 num = num.toFixed(0); let second = (num % 60); if (second < 10) second = '0' + second; let min = Math.floor(num / 60); if (min < 10) min = '0' + min; return min + ":" + second; } }, attached: function () { //组件显示初始化函数 var that = this; this.data.audioExample = wx.createInnerAudioContext(); //所有组件实例都放在一个容器AllExample里 AllExample.push(this.data.audioExample); this.data.audioExample.onPlay(function () { console.log('播放中。。。') }) this.data.audioExample.onTimeUpdate(function () { console.log('监听进度。。') }) //控制单个实例的isPlay this.data.audioExample.onPause(function () { that.setData({ isPlay: false }) }) // 每个组件实例播放结束 this.data.audioExample.onEnded(() => { this.setData({ currentTime: "00:00", isPlay: false, progress: 0, }) console.log('播放结束了') }) // 在组件实例进入页面节点树时执行 }, detached: function () { // 在组件实例被从页面节点树移除时执行 // 卸载 this.data.audioExample.destroy(); AllExample = []; } })