用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

微客吧 首页 教程 微信小程序 新手教程 查看内容

微信小程序page的生命周期和音频播放及监听

纸飞机 2018-3-8 09:35

作者:ForeverGuard,来自原文地址 本文相关跳坑指南:一、界面的生命周期 /** * 监听页面加载, * 页面加载中 */ onLoad:function(){ var _this = this console.log(' ...

作者:ForeverGuard,来自

原文地址


本文相关跳坑指南:

一、界面的生命周期

  1. /**
  2. * 监听页面加载,
  3. * 页面加载中
  4. */
  5. onLoad:function(){
  6. var _this = this
  7. console.log('index---------onload()')
  8. /**
  9. * 监听音乐播放
  10. */
  11. wx.onBackgroundAudioPlay(function() {
  12. console.log('onBackgroundAudioPlay')
  13. }),
  14. /**
  15. * 监听音乐暂停
  16. */
  17. wx.onBackgroundAudioPause(function() {
  18. console.log('onBackgroundAudioPause')
  19. }),
  20. /**
  21. * 监听音乐停止
  22. */
  23. wx.onBackgroundAudioStop(function() {
  24. console.log('onBackgroundAudioStop')
  25. util.playAudio()
  26. })
  27. },
  28. /**
  29. * 监听页面显示,
  30. * 当从当前页面调转到另一个页面
  31. * 另一个页面销毁时会再次执行
  32. */
  33. onShow: function() {
  34. console.log('index---------onShow()')
  35. },
  36. /**
  37. * 监听页面渲染完成
  38. * 完成之后不会在执行
  39. */
  40. onReady: function() {
  41. console.log('index---------onReaday()');
  42. },
  43. /**
  44. * 监听页面隐藏
  45. * 当前页面调到另一个页面时会执行
  46. */
  47. onHide: function() {
  48. console.log('index---------onHide()')
  49. },
  50. /**
  51. * 当页面销毁时调用
  52. */
  53. onUnload: function() {
  54. console.log('index---------onUnload')
  55. }

二、eg:使用播放音乐的系统方法

  wx.playBackgroundAudio()

  需要调用监听音乐的相关操作时,需要在onLoad中进行(在标题一中)

  1. function playAudio(){
  2. wx.playBackgroundAudio({
  3. dataUrl: 'http://m2.music.126.net/oO27f-6XZ2_jMV1gA8wzlA==/1319413953349380.mp3',
  4. title:'Blue Night',
  5. coverImgUrl:'http://pic.58pic.com/58pic/15/15/32/43x58PICgE2_1024.jpg',
  6. success: function(res){
  7. // success
  8. console.log("ok")
  9. },
  10. fail: function(res) {
  11. // fail
  12. console.log("fail")
  13. },
  14. complete: function(res) {
  15. // complete
  16. console.log("ok")
  17. }
  18. })
  19. }

三、号外:全局函数的声明使用

util.playAudio()方法是在文件util.js中,此文件放的是全局函数!

鲜花
鲜花
握手
握手
雷人
雷人
路过
路过
鸡蛋
鸡蛋
分享至 : QQ空间
收藏