极速入门微信小程序 | 生命周期篇（2-页面）

微信小程序页面生命周期

在编写微信小程序时，了解页面生命周期的概念至关重要。页面生命周期是指页面从创建到销毁所经历的不同阶段。微信小程序提供了四个页面生命周期函数，用于响应这些阶段的变化：

• onLoad()： 页面首次加载时触发。
• onReady()： 页面布局和数据准备好时触发。
• onShow()： 页面显示时触发。
• onHide()： 页面隐藏时触发。
• onUnload()： 页面销毁时触发。

onHide() 函数

当页面被隐藏时，onHide() 函数会被触发。这通常发生在以下情况下：

• 用户使用导航栏返回上一页。
• 使用 navigator 组件，其中 open-type 为 "redirect" 或 "navigate" 。

值得注意的是，如果用户关闭页面，onHide() 函数将不会触发。另外，需要在小程序的 json 文件中显式启用 onHide() 函数。

示例代码：

Page({
  onHide() {
    // 页面被隐藏时执行的操作
  }
})

onUnload() 函数

onUnload() 函数在页面销毁时触发。这通常发生在以下情况下：

• 用户关闭页面。
• 使用 navigator 组件，其中 open-type 为 "switchTab" 、"reLaunch" 或 "navigateBack" 。

示例代码：

Page({
  onUnload() {
    // 页面销毁时执行的操作
  }
})

使用 navigator 和 open-type

navigator 组件可用于在小程序页面之间导航。open-type 属性指定导航类型，它可以是以下值之一：

• "navigate" ：跳转到新页面。
• "redirect" ：关闭当前页面并跳转到新页面。
• "switchTab" ：切换到另一个 tab 页。
• "reLaunch" ：关闭所有页面并重新启动小程序。
• "navigateBack" ：返回上一页。

示例代码：

<navigator url="/pages/newPage/newPage" open-type="navigate">
  新页面
</navigator>

最佳实践

以下是一些使用页面生命周期事件的最佳实践：

• 在 onHide() 中释放资源： 释放不必要的内存，例如定时器和事件监听器。
• 在 onUnload() 中清理数据： 删除不再需要的变量和数据。
• 谨慎使用 onHide() 和 onUnload()： 不要在这些函数中执行耗时的任务，因为它们可能会导致页面响应延迟。
• 充分利用导航配置： 使用 navigator 和 open-type 来控制页面之间的导航行为。

通过遵循这些最佳实践，您可以有效利用微信小程序页面生命周期，提升用户体验并优化小程序的性能。