微信小程序入门 音乐播放器的暂停播放 图片切换。

• 在界面上用数据绑定，切换播放与暂停时的图片

• <image catchtap='onMusicTap' class='audio' src="{{isPlayingMusic?'/images/music/music-stop.png':'/images/music/music-start.png'}}"></image>

• 在JS代码上定义一个布尔值，默认是false，默认暂停。

• /**
     * 页面的初始数据
     */
    data: {
      isPlayingMusic: false
    },
  

  具体的代码实现如下：

  onMusicTap: function(event) {

    var isPlayingMusic = this.data.isPlayingMusic;
    console.log(isPlayingMusic);
    if (isPlayingMusic) {
      wx.pauseBackgroundAudio();
      // 设置setData值，前端界面才能读取到isPlayingMusic是值，以下同理
      this.setData({
        isPlayingMusic: false
      })
      
      console.log("pauseBackgroundAudio");
    } else {
      wx.playBackgroundAudio({
        dataUrl: 'http://music.163.com/song/media/outer/url?id=574919767.mp3',
        title: '不要平凡',
        coverImgUrl: '',
       
      })
      this.setData({
        isPlayingMusic:true
      })
      

      console.log(isPlayingMusic);
    }

  }

• 默认状态下
• 
• 点击播放
• 
• 点击暂停
• 

播放暂停虽然自带的播放器也能使用，但我们编辑的初衷就是希望用自己的方式来定义播放方式。微信为此提供大量的API，以满足开发者的各种需求。

备注，音乐链接无法获取的话，你们可以使用我的，可能会失效，可以留言，我可以更新给你们。