小程序的背景音频

最近在写一个文章列表，点击每篇文章进入文章详情页面，会有不同的背景音乐，点击返回，背景音乐仍然会在后台播放

在app.js的onLaunch函数中

 //获取全局唯一的背景音频管理器
    this.appMusic=wx.getBackgroundAudioManager();

在app.json中配置在后台运行的功能

"requiredBackgroundModes": ["audio"],

在详情页面的onLoad函数中，调用一下方法

setMusic (){
   //若连着两次进入 同一个页面，则不需要设置音乐，直接是后台正在播放的音乐
    //在a页面将音乐停止或者正常播放完，再次进入同一a页面需要重新设置音乐，所有有了后半部分的判断
    if ((app.globalData.postID != this.data.postID) || (app.globalData.postID == this.data.postID&&app.globalData.isStop)) {
      console.log('需要设置音乐')
      app.appMusic.startTime = '10'
      app.appMusic.src = this.data.musicIndex.url;
      app.appMusic.title = this.data.musicIndex.title;
      app.appMusic.coverImgUrl = this.data.musicIndex.coverImg;
    } 
    //监听音乐播放
    app.appMusic.onPlay(() => {
      console.log('音乐播放了');
      this.setData({
        isStart: true
      })
    });
    //监听音乐暂停
    app.appMusic.onPause(() => {
      console.log('音乐暂停了');
      this.setData({
        isStart: false
      })
    });
    //监听音乐停止
    app.appMusic.onStop(() => {
      console.log('音乐停止了')
      app.globalData.isStop=true;
      this.setData({
        isStart: false
      })
    })
    //监听到音乐播放完了
    app.appMusic.onEnded(()=>{
      app.globalData.isStop = true;
      this.setData({
        isStart:false
      })
    })
  },

在点击详情页面的，控制音乐播放暂停的小图标

<image wx:if="{{isStart}}" src="/images/music/music-stop.png" class="music" bindtap="goMusic"/>
<image wx:else src="/images/music/music-start.png" class="music" bindtap="goMusic"/>

goMusic (){
    if(this.data.isStart){//需要暂停
         app.appMusic.pause();
    }else{//需要播放
           //若是音乐停止之后的播放
           if(app.globalData.isStop){//从头播放
              app.appMusic.startTime = '10'
              app.appMusic.src = this.data.musicIndex.url;
              app.appMusic.title = this.data.musicIndex.title;
              app.appMusic.coverImgUrl = this.data.musicIndex.coverImg;
           }else{//接着暂停的开始播放
             app.appMusic.play();
           }
    }
    this.setData({
      isStart:!this.data.isStart
    })
  },

判断两次进入的文章详情是否是同一篇文章

//当从详情页面 返回列表页面，会执行onUnload
onUnload: function () {
    //目的保存上一个页面的id,再次进入这个页面音乐会接着播放
    app.globalData.postID=this.data.postID;
  },