上篇教程
微信小程序的文件結構 —— 微信小程序教程系列（1）
微信小程序的生命周期函數有2個
一個是App的生命周期
另一個是Page的生命周期
App的生命周期
示例：演示App的生命周期函數app.js：App({ onLaunch: function () { console.log("App生命周期函數——onLaunch函數"); }, onShow: function () { console.log("App生命周期函數——onShow函數"); }, onHide: function () { console.log("App生命周期函數——onHide函數"); }, onError: function (msg) { console.log("App生命周期函數——onError函數"); }})運行：（1）程序啟動時，會觸發以下2個函數第一執行onLauch函數——當小程序初始化完成時，會觸發 onLaunch（全局只觸發一次）第二執行onShow函數——當小程序啟動，或從后臺進入前臺顯示，會觸發 onShow
（2）當點擊“后臺”時，會觸發以下函數（即程序被轉到后臺時）onHide函數——當小程序從前臺進入后臺，會觸發 onHide
當點擊“前臺”時，就會再次觸發onShow函數
示例： 演示Page的生命周期函數home.js：Page({ data:{ }, onLoad:function(options){// 生命周期函數--監聽頁面加載console.log("Page onLoad函數"); }, onReady:function(){// 生命周期函數--監聽頁面初次渲染完成console.log("Page onReady函數"); }, onShow:function(){// 生命周期函數--監聽頁面顯示console.log("Page onShow函數"); }, onHide:function(){// 生命周期函數--監聽頁面隱藏console.log("Page onHide函數"); }})運行：（1）當啟動home頁面時，會觸發以下3個函數第一執行onLoad函數——在文檔加載的時候會執行第二執行onShow函數——在頁面顯示的時候會執行第三執行onReady函數——在頁面初次渲染完成時執行
（2）在Home頁面時，當點擊左上角“返回”，會觸發以下函數onUnload函數——在頁面銷毀時執行
（3）在Home頁面時，當點擊“后臺”時，會觸發以下函數（即程序被轉到后臺時）onHide函數——在頁面隱藏時會執行
（4）在Home頁面時，當點擊“前臺”時，會觸發以下函數（即程序從后臺被重新轉回前臺時）onShow函數——在頁面顯示時會執行
示例：演示App生命周期函數和Page生命周期函數的結合使用
app.js：
在app.js文件添加以下幾個生命周期函數
App({
onLaunch: function () {
console.log("App生命周期函數——onLaunch函數");
},
onShow: function () {
console.log("App生命周期函數——onShow函數");
},
onHide: function () {
console.log("App生命周期函數——onHide函數");
},
onError: function (msg) {
console.log("App生命周期函數——onError函數");
}
})
index.js：
在index.js文件添加以下幾個生命周期函數
Page({
data:{ },
onLoad:function(options){
// 生命周期函數--監聽頁面加載
console.log("Page onLoad函數");
},
onReady:function(){
// 生命周期函數--監聽頁面初次渲染完成
console.log("Page onReady函數");
},
onShow:function(){
// 生命周期函數--監聽頁面顯示
console.log("Page onShow函數");
},
onHide:function(){
// 生命周期函數--監聽頁面隱藏
console.log("Page onHide函數");
},
onUnload:function(){
// 生命周期函數--監聽頁面卸載
console.log("Page onUnload函數");
}
})
運行：
（1）程序啟動時
首先執行的是App的生命周期函數
接著再執行Page的生命周期函數
（2）當點擊“后臺”時，會觸發以下函數（即程序被轉到后臺時）
首先執行Page的onHide生命周期函數
再執行App的onHide生命周期函數
（3）當點擊“前臺”時（即程序返回前臺時）
首先執行Page的onShow生命周期函數
再執行App的onShow生命周期函數
新聞熱點
疑難解答
