之前講了小程序全局的生命周期，今天咱們說說單個頁面的生命周期！源碼：https://github.com/limingios/wxProgram.git 中的No.5

雙遼網站建設公司創新互聯建站,雙遼網站設計制作，有大型網站制作公司豐富經驗。已為雙遼上千家提供企業網站建設服務。企業網站搭建\外貿網站制作要多少錢，請找那個售后服務好的雙遼做網站的公司定做！

Page頁面的生命周期

• 官方介紹

https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/page.html

• 運行小程序查看生命周期

//index.js
//獲取應用實例
const?app?=?getApp()

Page({
??data:?{
????motto:?'Hello?World',
????userInfo:?{},
????hasUserInfo:?false,
????canIUse:?wx.canIUse('button.open-type.getUserInfo')
??},

??onLoad:?function?()?{
????console.log("index->onLoad")
??????this.setData({
????????motto:?app.globalData
??????})
??},
??onReady:?function?()?{
????console.log("index->onReady")
??},
??onShow:?function?()?{
????console.log("index->onShow")
??},
??onHide:?function?()?{
????console.log("index->onHide")
??},
??onUnload:?function?()?{
????console.log("index->onUnload")
??},
})

加載onLoad，加載onShow，全部顯示的時候調用onReady

• 修改代碼演示onHide 和 onUnload
  >增加一個綁定事件跳轉的方式來演示onHide和onUnLoad

1. navigateTo

//index.js
//獲取應用實例
const?app?=?getApp()

Page({
??data:?{
????motto:?'Hello?World',
????userInfo:?{},
????hasUserInfo:?false,
????canIUse:?wx.canIUse('button.open-type.getUserInfo')
??},

??onLoad:?function?()?{
????console.log("index->onLoad")
??????this.setData({
????????motto:?app.globalData
??????})
??},
??onReady:?function?()?{
????console.log("index->onReady")
??},
??onShow:?function?()?{
????console.log("index->onShow")
??},
??onHide:?function?()?{
????console.log("index->onHide")
??},
??onUnload:?function?()?{
????console.log("index->onUnload")
??},
??clickMe:?function(){
????wx.navigateTo({
??????url:?'../test/test',
????})
??}
})

左上角有返回鍵

navigateTo 可以hide

1. redirectTo

//index.js
//獲取應用實例
const?app?=?getApp()

Page({
??data:?{
????motto:?'Hello?World',
????userInfo:?{},
????hasUserInfo:?false,
????canIUse:?wx.canIUse('button.open-type.getUserInfo')
??},

??onLoad:?function?()?{
????console.log("index->onLoad")
??????this.setData({
????????motto:?app.globalData
??????})
??},
??onReady:?function?()?{
????console.log("index->onReady")
??},
??onShow:?function?()?{
????console.log("index->onShow")
??},
??onHide:?function?()?{
????console.log("index->onHide")
??},
??onUnload:?function?()?{
????console.log("index->onUnload")
??},
??clickMe:?function(){
????wx.redirectTo({
??????url:?'../test/test',
????})
??}
})

redirectTo 有onUnLoad 沒有hide

PS：這塊主要是對配置的生命周期的熟悉，了解下redirectTo 和 navigateTo 之前的區別。

>>原創文章，歡迎轉載。轉載請注明：轉載自IT人故事會，謝謝！
>>原文鏈接地址：「小程序JAVA實戰」 小程序私有頁面的生命周期以及導航（10）

名稱欄目：「小程序JAVA實戰」小程序私有頁面的生命周期以及導航（1
網頁鏈接：http://m.2m8n56k.cn/article4/jdsgoe.html

成都網站建設公司_創新互聯，為您提供ChatGPT、App開發、定制開發、服務器托管、面包屑導航、品牌網站制作

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：[email protected]。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯