小程序模板网

微信小程序this报错,后台音乐播放注意事项

发布时间:2018-04-18 09:38 所属栏目:小程序开发教程

一:this报错

1、报错this.getUserInfo(this.setData) is not a function;at pages/index/index onShow function;at api request success callback function 
TypeError: this.getUserInfo is not a function

在回调结果里调用这个页面的函数 this.fun() 或者 this.setData 时就会报错,这时要在函数一开时的地方使用var that = this;,然后使用that调用数据。

这里的this指向的就是请求本身了如( wx.request ),而不是这个页面!!!

 

				
  1. onLoad:function(options){
  2. this.login();
  3. },
  4.  
  5. login:function(){
  6. var that = this;// 这个地方非常重要,重置data{}里数据时候setData方法的this应为以及函数的this, 如果在下方的sucess直接写this就变成了wx.request()的this了
  7. wx.login({
  8. success: function (res) {
  9. if (res.code) {
  10. //发起网络请求
  11. wx.request({
  12. url: 'https://applet.ech-med.com/appwx/getAppToken',
  13. data: {
  14. code: res.code
  15. },
  16. success: function (re) {
  17. console.log(re);that.getUserInfo();
  18.          that.setData({ });//如果在sucess直接写this就变成了wx.request()的this了.必须为getdata函数的this,不然无法重置调用函数
  19. }
  20. })
  21. } else {
  22. console.log('获取用户登录态失败!' + res.errMsg)
  23. }
  24. }
  25. })
  26. },
  27.  
  28. getUserInfo: function () {
  29. console.log("获取用户信息")
  30. },
 

二:后台音乐播放注意事项

分享者:默识,来自原文地址

  1. wx.seekBackgroundAudio(OBJECT)

    作用:控制音乐播放进度。

    注意: 该事件 会触发 wx.onBackgroundAudioPlay(CALLBACK) 事件 ,也就是相当于在调整进度后,后台会自动的调用wx.playBackgroundAudio(OBJECT)函数。

  2. 使用 audio组件 制作的播放器,即使点击"显示在微信顶部",音乐依然会停止,使用 wx.playBackgroundAudio 相关API制作的播放器才不会。

  3. wx.playBackgroundAudio(OBJECT),wx.pauseBackgroundAudio(),wx.seekBackgroundAudio(OBJECT),wx.stopBackgroundAudio()

    注意:上述四个操作都是 异步操作,都可以设置OBJECT参数,都有 success , fail , complete 回调 ,参照wx.playBackgroundAudio(OBJECT) 的 OBJECT说明,OBJECT说明

  4. 后台播放音乐暂停后怎么从上次播放的地方继续播放?

    • 使用 seekBackgroundAudio。

      官网并没有相关解释,初步思路是使用 playBackgroundAudio 播放音乐后,再调用 seekBackgroundAudio 将进度调整到上次停止的地方,但是由上面的第一条所描述,这样做的结果会导致onBackgroundAudioPlay 会被触发两次,所以我们可以直接调用seekBackgroundAudio调整播放进度即可(前提是之前有播放过歌曲,就是确保歌曲地址已经被设置,不然无效),随后音乐会自动播放.

    • 使用 playBackgroundAudio

      经测试调用playBackgroundAudio,并且传入的歌曲地址参数和上次相同时,歌曲会从上次暂停的时间位置继续播放

  5. wx.stopBackgroundAudio

    注意:经测试,再调用 wx.stopBackgroundAudio 函数之后,紧接着调用 wx.playBackgroundAudio ,在pc端模拟测试时正常,后台会停止播放音乐,然后再播放新的音乐,但是,在手机上却会打断紧接着调用的 wx.playBackgroundAudio 的播放(坑啊T-T),测试真机为phone5。

  6. 回调函数的触发时机。

    • wx.onBackgroundAudioPlay(CALLBACK) 监听音乐播放。

    • wx.onBackgroundAudioPause(CALLBACK) 监听音乐暂停。

    • wx.onBackgroundAudioStop(CALLBACK) 监听音乐停止。

    上述监听函数会在调用对应的wx.playBackgroundAudio(OBJECT),wx.pauseBackgroundAudio(),wx.stopBackgroundAudio()等函数时,会被立即触发,对应的操作可能并没有完成,比如调用 playBackgroundAudio播放音乐,只是给后台发送信息,要播放音乐,但是此时音乐并没有开始播放,可能还在加载等等,但是onBackgroundAudioPlay的回调函数会立即调用。

    而wx.playBackgroundAudio(OBJECT),wx.pauseBackgroundAudio(OBJECT),wx.seekBackgroundAudio(OBJECT),wx.stopBackgroundAudio(OBJECT)中OBJECT里面的回调函数会在如下对应条件触发:

    • 在歌曲加载完成之后,可以播放时触发

    • 在歌曲暂停之后,没有声音之后触发

    • 歌曲进度设置完成并且开始播放之后触发

    • 歌曲停止之后触发

    wx.onBackgroundAudioPlay(CALLBACK) , wx.onBackgroundAudioPause(CALLBACK) , wx.onBackgroundAudioStop(CALLBACK) 函数可以监听后台操作歌曲时,触发的事件,比如当小程序退出后,音乐暂停,也包括我们使用 wx.pauseBackgroundAudio 等函数时触发的事件。

    在wx.onBackgroundAudioPause(OBJECT)里面的 暂停回调函数函数不会被触发,wx.pauseBackgroundAudio(OBJECT)里面的回调函数只是当次主动操作有效。后台自动暂停歌曲时并不会触发该回调函数,wx.playBackgroundAudio(OBJECT),wx.pauseBackgroundAudio(),wx.seekBackgroundAudio(OBJECT),wx.stopBackgroundAudio()都是一样的机制。

  7. 怎么获取歌曲播放时的 回调函数?

    微信小程序官方文档,playBackgroundAudio相关额API并没有提供此函数,但是提供了wx.getBackgroundAudioPlayerState函数用于获取歌曲播放时歌曲额进度信息,所以我们可以使用setInterval定时函数模拟这个事件。下面是我模拟的相关事件,

    var timer = setInterval(() => {
        wx.getBackgroundAudioPlayerState({
            success:function(res){
                //调用需要更新的
                //self._onUpdate(res);
            }
        });
    }, 500);
  8. 最重要的一点,pc端的模拟器,上面描述的事件触的顺序会可能和手机端的触发顺序不一样(T-T,天坑,本来调试好好的,pc端app突然就抽风,炸了,有时候播放歌曲后 立刻就暂停,至今不知道是为什么,手机端却是正常的),所以还是多真机调试吧,都是泪。



易优小程序(企业版)+灵活api+前后代码开源 码云仓库:starfork
本文地址:https://www.eyoucms.com/wxmini/doc/course/23609.html 复制链接 如需定制请联系易优客服咨询:800182392 点击咨询
QQ在线咨询