微信小程序 生命周期函数详解

什么是生命周期函数

在小程序中，生命周期函数指的是小程序在不同阶段会自动执行的函数。小程序框架在不同的阶段会执行不同的生命周期函数，让开发者能够在生命周期函数中完成代码逻辑。

生命周期函数分类

小程序中的生命周期函数分为两类：

• 应用生命周期函数
• 页面生命周期函数

应用生命周期函数

应用生命周期函数是指小程序作为整个应用的部分，每个小程序都会有应用生命周期函数。

应用生命周期函数包括：

• onLaunch：当小程序初始化完成时，会触发onLaunch事件执行。
• onShow：当小程序启动或者从后台进入前台显示时，会触发onShow事件执行。
• onHide：当小程序从前台进入后台时，会触发onHide事件执行。
• onError：当小程序发生脚本错误或者API调用失败时，会触发onError事件执行。
• onPageNotFound：当小程序中页面不存在时，会触发onPageNotFound事件执行。

页面生命周期函数

页面生命周期函数是指小程序中每个页面都有独立的生命周期函数。

页面生命周期函数包括：

• onLoad：页面加载时触发，一个页面只会调用一次，可以在onLoad的参数中获取打开当前页面路径中的参数。
• onShow：页面显示时触发，每次打开页面都会调用一次。
• onReady：页面初次渲染完成时触发，一个页面只会调用一次，在当前页面的declarative components(声明式组件)渲染完成后触发。
• onHide：页面隐藏时触发，当navigateTo或者底部tab切换时调用。
• onUnload：页面卸载时触发，当redirectTo或者navigateBack的时候调用。

示例说明

应用生命周期函数示例

App({
  onLaunch: function () {
    console.log('小程序初始化完成')
  },
  onShow: function () {
    console.log('小程序启动或从后台进入前台显示')
  },
  onHide: function () {
    console.log('小程序从前台进入后台')
  },
  onError: function (msg) {
    console.log('小程序发生脚本错误或API调用失败', msg)
  },
  onPageNotFound: function (options) {
    console.log('小程序中页面不存在', options)
  }
})

页面生命周期函数示例

Page({
  onLoad: function (options) {
    console.log('页面加载完成', options)
  },
  onShow: function () {
    console.log('页面显示')
  },
  onReady: function () {
    console.log('页面初次渲染完成')
  },
  onHide: function () {
    console.log('页面隐藏')
  },
  onUnload: function () {
    console.log('页面卸载')
  }
})

以上就是关于微信小程序生命周期函数的详细讲解，希望对你有帮助。

阅读剩余 49%