Speaking before a small program global life cycle, today we talk about the life cycle of a single page! Source: https: //github.com/limingios/wxProgram.git in No.5
Page page life cycle
The official introduction
https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/page.html
Run a small program to view life cycle
//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
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
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 have onUnLoad not hide
PS: this is mainly on the configuration of the lifecycle familiar with and understand the difference between the previous and next redirectTo navigateTo.
>> original article, welcome to reprint. Reproduced please specify: Reprinted from IT people story , thank you!
>> Original link address: "JAVA applet real" applet page private life cycle and navigation (10)