「小程序JAVA實(shí)戰(zhàn)」 小程序私有頁(yè)面的生命周期以及導(dǎo)航（1

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

Page頁(yè)面的生命周期

• 官方介紹

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

• 運(yùn)行小程序查看生命周期

//index.js
//獲取應(yīng)用實(shí)例
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，全部顯示的時(shí)候調(diào)用onReady

• 修改代碼演示onHide 和 onUnload
  >增加一個(gè)綁定事件跳轉(zhuǎn)的方式來(lái)演示onHide和onUnLoad

1. navigateTo

//index.js
//獲取應(yīng)用實(shí)例
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
//獲取應(yīng)用實(shí)例
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 沒(méi)有hide

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

>>原創(chuàng)文章，歡迎轉(zhuǎn)載。轉(zhuǎn)載請(qǐng)注明：轉(zhuǎn)載自IT人故事會(huì)，謝謝！
>>原文鏈接地址：「小程序JAVA實(shí)戰(zhàn)」 小程序私有頁(yè)面的生命周期以及導(dǎo)航（10）