微信小程序(九)- 生命周期

139 阅读2分钟

携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第9天,点击查看活动详情

本次系列文章参与八月的更文活动,记录一个微信小程序从零到有的开发过程。本文为本系列九篇:关于微信小程序的生命周期。

微信小程序的生命周期分为整个应用的生命周期和页面的声明周期。

应用生命周期

app.js 中来使用应用的生命周期事件

属性类型说明
onLaunchfunction监听小程序初始化
onShowfunction监听小程序启动或切前台
onHidefunction监听小程切后台
onErrorfunction错误监听函数
onPageNotFoundfunction页面不存在监听函数

页面的生命周期

属性类型说明
dataObject页面的初始化数据
onLoadfunction生命周期回调——监听页面加载
onShowfunction生命周期回调——监听页面显示
onReadyfunction生命周期回调——监听页面初次渲染完成
onHidefunction生命周期回调——监听页面隐藏
onUnloadfunction生命周期回调——监听页面卸载
onPullDownRefreshfunction监听用户下拉动作
onReachBottomfunction页面上拉触底事件的处理函数
onSharAppMessagefunction用户点击右上角转发
onPageScrollfunction页面滚动触发事件的处理函数
onResizefunction页面尺寸改变时触发
onTabItemTapfunction当前是tab页时,点击tab时触发

补充:

  • onLoad:页面开始加载的时候触发,一般在此发送异步请求,可通过options来获取页面url参数
  • onUnload:当点击超链接跳转页面的同时,关闭当前页面就会触发
  • onPullDownRefresh:下拉重新请求数据或者初始化页面进而模拟刷新操作(需要在页面json文件中添加enablePullDownRefresh:true允许下拉)
  • onReachBottom :上滑触底事件,常用于加载下一页数据的功能
  • onResize:其实是在页面横屏竖屏触发的,必须要在json文件中加入一个配置否则无法触发,即:"pageOrientain":"auto"

页面生命周期图解

image.png