微信小程序page的生命周期和音頻播放及監(jiān)聽實(shí)例詳解
一、界面的生命周期
/**
* 監(jiān)聽頁(yè)面加載,
* 頁(yè)面加載中
*/
onLoad:function(){
var _this = this
console.log('index---------onload()')
/**
* 監(jiān)聽音樂播放
*/
wx.onBackgroundAudioPlay(function() {
console.log('onBackgroundAudioPlay')
}),
/**
* 監(jiān)聽音樂暫停
*/
wx.onBackgroundAudioPause(function() {
console.log('onBackgroundAudioPause')
}),
/**
* 監(jiān)聽音樂停止
*/
wx.onBackgroundAudioStop(function() {
console.log('onBackgroundAudioStop')
util.playAudio()
})
},
/**
* 監(jiān)聽頁(yè)面顯示,
* 當(dāng)從當(dāng)前頁(yè)面調(diào)轉(zhuǎn)到另一個(gè)頁(yè)面
* 另一個(gè)頁(yè)面銷毀時(shí)會(huì)再次執(zhí)行
*/
onShow: function() {
console.log('index---------onShow()')
},
/**
* 監(jiān)聽頁(yè)面渲染完成
* 完成之后不會(huì)在執(zhí)行
*/
onReady: function() {
console.log('index---------onReaday()');
},
/**
* 監(jiān)聽頁(yè)面隱藏
* 當(dāng)前頁(yè)面調(diào)到另一個(gè)頁(yè)面時(shí)會(huì)執(zhí)行
*/
onHide: function() {
console.log('index---------onHide()')
},
/**
* 當(dāng)頁(yè)面銷毀時(shí)調(diào)用
*/
onUnload: function() {
console.log('index---------onUnload')
}
二、eg:使用播放音樂的系統(tǒng)方法
wx.playBackgroundAudio()
需要調(diào)用監(jiān)聽音樂的相關(guān)操作時(shí),需要在onLoad中進(jìn)行(在標(biāo)題一中)
function playAudio(){
wx.playBackgroundAudio({
dataUrl: 'http://m2.music.126.net/oO27f-6XZ2_jMV1gA8wzlA==/1319413953349380.mp3',
title:'Blue Night',
coverImgUrl:'http://pic.58pic.com/58pic/15/15/32/43x58PICgE2_1024.jpg',
success: function(res){
// success
console.log("ok")
},
fail: function(res) {
// fail
console.log("fail")
},
complete: function(res) {
// complete
console.log("ok")
}
})
}
三、號(hào)外:全局函數(shù)的聲明使用
util.playAudio()方法是在文件util.js中,此文件放的是全局函數(shù)!

感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
- 微信小程序?qū)崿F(xiàn)播放音頻
- 微信小程序?qū)崿F(xiàn)錄音與音頻播放功能
- 微信小程序?qū)崿F(xiàn)音頻文件播放進(jìn)度的實(shí)例代碼
- 微信小程序多音頻播放進(jìn)度條問題
- 微信小程序獲取音頻時(shí)長(zhǎng)與實(shí)時(shí)獲取播放進(jìn)度問題
- IOS中微信小程序播放緩存的音頻文件的方法
- 微信小程序開發(fā)之錄音機(jī) 音頻播放 動(dòng)畫實(shí)例 (真機(jī)可用)
- 微信小程序-圖片、錄音、音頻播放、音樂播放、視頻、文件代碼實(shí)例
- 微信小程序 audio音頻播放詳解及實(shí)例
- 微信小程序?qū)崿F(xiàn)播放音頻功能
相關(guān)文章
await-to-js源碼深入理解處理異步任務(wù)用法示例
這篇文章主要為大家介紹了await-to-js源碼更完美處理異步任務(wù)示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-08-08
web?worker在項(xiàng)目中的使用學(xué)習(xí)為項(xiàng)目增加亮點(diǎn)
這篇文章主要為大家介紹了web?worker使用學(xué)習(xí)來為你的項(xiàng)目增加亮點(diǎn),有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-07-07
微信小程序 animation API詳解及實(shí)例代碼
這篇文章主要介紹了 微信小程序 animation API詳解及實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下2016-10-10
微信小程序 五星評(píng)分的實(shí)現(xiàn)實(shí)例
這篇文章主要介紹了微信小程序 五星評(píng)分的實(shí)現(xiàn)實(shí)例的相關(guān)資料,這里提供實(shí)現(xiàn)實(shí)例幫助大家實(shí)現(xiàn)改功能,需要的朋友可以參考下2017-08-08

