微信APP生命周期及页面生命周期示例详解

微信APP生命周期

1. onLaunch(options)

当小程序初始化完成时，会触发onLaunch函数。这个函数包含一个options参数，是小程序打开所调用的方式以及打开的路径等信息。

示例：

App({
  onLaunch: function(options) {
    console.log(options)
  }
})

2. onShow(options)

当小程序启动或从后台进入前台时，就会触发onShow函数。和onLaunch函数一样，也包含一个options参数。

示例：

App({
  onShow: function(options) {
    console.log(options)
  }
})

3. onHide()

当小程序进入后台时，即用户点击home键或者进入到其他小程序时，会触发onHide函数。

示例：

App({
  onHide: function() {
    console.log('小程序进入后台')
  }
})

4. onError(msg)

当小程序发生错误时，会触发onError函数。并且可以通过msg参数获取到错误信息。

示例：

App({
  onError: function(msg) {
    console.log('小程序出现错误：' + msg)
  }
})

页面生命周期

1. onLoad(options)

当页面加载时，会触发onLoad函数。同样也包含一个options参数。

示例：

Page({
  onLoad: function(options) {
    console.log(options)
  }
})

2. onShow()

当页面展示时，会触发onShow函数。

示例：

Page({
  onShow: function() {
    console.log('页面展示')
  }
})

3. onHide()

当页面被隐藏时，会触发onHide函数。

示例：

Page({
  onHide: function() {
    console.log('页面被隐藏')
  }
})

4. onUnload()

当页面被卸载时，会触发onUnload函数。

示例：

Page({
  onUnload: function() {
    console.log('页面被卸载')
  }
})

示例说明

示例1：监听页面加载和展示

Page({
  onLoad: function(options) {
    console.log(options)
  },
  onShow: function() {
    console.log('页面展示')
  }
})

解释：
以上示例代码，实现了监听页面加载和展示两个生命周期函数。在页面加载时触发onLoad函数，在页面展示时触发onShow函数。

示例2：监听页面卸载和隐藏

Page({
  onHide: function() {
    console.log('页面被隐藏')
  },
  onUnload: function() {
    console.log('页面被卸载')
  }
})

解释：
以上示例代码，实现了监听页面卸载和隐藏。在页面被隐藏时触发onHide函数，在页面被卸载时触发onUnload函数。