微信小程序的生命周期函数有哪些?

news2024/11/19 15:31:40

面试官:说说微信小程序的生命周期函数有哪些?

一、是什么

vuereact框架一样,微信小程序框架也存在生命周期,实质也是一堆会在特定时期执行的函数

小程序中,生命周期主要分成了三部分:

  • 应用的生命周期
  • 页面的生命周期
  • 组件的生命周期

应用的生命周期

小程序的生命周期函数是在app.js里面调用的,通过App(Object)函数用来注册一个小程序,指定其小程序的生命周期回调

页面的生命周期

页面生命周期函数就是当你每进入/切换到一个新的页面的时候,就会调用的生命周期函数,同样通过App(Object)函数用来注册一个页面

组件的生命周期

组件的生命周期,指的是组件自身的一些函数,这些函数在特殊的时间点或遇到一些特殊的框架事件时被自动触发,通过Component(Object)进行注册组件

二、有哪些

应用的生命周期

生命周期说明
onLaunch小程序初始化完成时触发,全局只触发一次
onShow小程序启动,或从后台进入前台显示时触发
onHide小程序从前台进入后台时触发
onError小程序发生脚本错误或 API 调用报错时触发
onPageNotFound小程序要打开的页面不存在时触发
onUnhandledRejection()小程序有未处理的 Promise 拒绝时触发
onThemeChange系统切换主题时触发

页面的生命周期

生命周期说明作用
onLoad生命周期回调—监听页面加载发送请求获取数据
onShow生命周期回调—监听页面显示请求数据
onReady生命周期回调—监听页面初次渲染完成获取页面元素(少用)
onHide生命周期回调—监听页面隐藏终止任务,如定时器或者播放音乐
onUnload生命周期回调—监听页面卸载终止任务

组件的生命周期

生命周期说明
created生命周期回调—监听页面加载
attached生命周期回调—监听页面显示
ready生命周期回调—监听页面初次渲染完成
moved生命周期回调—监听页面隐藏
detached生命周期回调—监听页面卸载
error每当组件方法抛出错误时执行

注意的是:

  • 组件实例刚刚被创建好时, created 生命周期被触发,此时,组件数据 this.data 就是在 Component 构造器中定义的数据 data , 此时不能调用 setData
  • 在组件完全初始化完毕、进入页面节点树后, attached 生命周期被触发。此时, this.data 已被初始化为组件的当前值。这个生命周期很有用,绝大多数初始化工作可以在这个时机进行
  • 在组件离开页面节点树后, detached 生命周期被触发。退出一个页面时,如果组件还在页面节点树中,则 detached 会被触发

还有一些特殊的生命周期,它们并非与组件有很强的关联,但有时组件需要获知,以便组件内部处理,这样的生命周期称为“组件所在页面的生命周期”,在 pageLifetimes 定义段中定义,如下:

生命周期说明
show组件所在的页面被展示时执行
hide组件所在的页面被隐藏时执行

代码如下:

Component({
  pageLifetimes: {
    show: function() {
      // 页面被展示
    },
    hide: function() {
      // 页面被隐藏
    },
  }
})

三、执行过程

应⽤的⽣命周期执行过程:

  • ⽤户⾸次打开⼩程序,触发 onLaunch(全局只触发⼀次)

  • ⼩程序初始化完成后,触发onShow⽅法,监听⼩程序显示

  • ⼩程序从前台进⼊后台,触发 onHide⽅法

  • ⼩程序从后台进⼊前台显示,触发 onShow⽅法

  • ⼩程序后台运⾏⼀定时间,或系统资源占⽤过⾼,会被销毁

⻚⾯⽣命周期的执行过程:

  • ⼩程序注册完成后,加载⻚⾯,触发onLoad⽅法
  • ⻚⾯载⼊后触发onShow⽅法,显示⻚⾯
  • ⾸次显示⻚⾯,会触发onReady⽅法,渲染⻚⾯元素和样式,⼀个⻚⾯只会调⽤⼀次
  • 当⼩程序后台运⾏或跳转到其他⻚⾯时,触发onHide⽅法
  • 当⼩程序有后台进⼊到前台运⾏或重新进⼊⻚⾯时,触发onShow⽅法
  • 当使⽤重定向⽅法 wx.redirectTo() 或关闭当前⻚返回上⼀⻚wx.navigateBack(),触发onUnload

当存在也应用生命周期和页面周期的时候,相关的执行顺序如下:

  • 打开小程序:(App)onLaunch --> (App)onShow --> (Pages)onLoad --> (Pages)onShow --> (pages)onRead

  • 进入下一个页面:(Pages)onHide --> (Next)onLoad --> (Next)onShow --> (Next)onReady

  • 返回上一个页面:(curr)onUnload --> (pre)onShow

  • 离开小程序:(App)onHide

  • 再次进入:小程序未销毁 --> (App)onShow(执行上面的顺序),小程序被销毁,(App)onLaunch重新开始执行.

参考文献

  • https://github.com/ytanck/ytanck.github.io/issues/79
  • https://developers.weixin.qq.com/miniprogram/dev/reference/api/App.html#onLaunch-Object-object
  • https://developers.weixin.qq.com/miniprogram/dev/reference/api/Page.html#onLoad-Object-query
  • https://developers.weixin.qq.com/miniprogram/dev/reference/api/App.html#onLaunch-Object-object

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1371275.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

用React给XXL-JOB开发一个新皮肤(二):目录规划和路由初始化

目录 一. 简述二. 目录规划三. Vite 配置 3.1. 配置路径别名3.2. 配置 less 四. 页面 4.1. 入口文件4.2. 骨架文件4.3. 普通页面 五. 路由配置六. 预览启动 一. 简述 上一篇文章我们介绍了项目初始化,此篇文章我们会先介绍下当前项目的目录规划,接着对…

学习JavaEE的日子 day11 初识面相对象

day11 1.初识面相对象 1.1 类和对象的理解 类 * 类是对象的数据类型,类是具有相同属性和行为的一组对象的集合 * 简单理解:类就是对现实事物的一种描述 类的组成 * 属性:指事物的特征,例如:手机事物(品牌…

【2023】java常用HTTP客户端对比以及使用(HttpClient/OkHttp/WebClient)

💻目录 1、介绍2、使用2.1、添加配置2.1.1、依赖2.1.2、工具类2.1.3、实体2.1.4、Controller接口 2.2、Apache HttpClient使用2.3 、OkHttp使用2.4、WebClient使用 1、介绍 现在java使用的http客户端主要包括以下几种 而这些中使用得最频繁的主要是: A…

麒麟系统安装docker、mysql、clickhouse

1、查看麒麟系统版本信息 cat /etc/os-release 麒麟系统版本V10 64位操作系统 # uname -p x86_64 # uname -p aarch64 内核版本 # uname -r 4.19.90-24.4.v2101.ky10.x86_64 本操作为麒麟系统版本V10,x86_64操作系统 一,安装docker 文件&#xff1a…

基于uniapp封装的table组件

数据格式 tableData: [{elcInfo: [{tableData:[1,293021.1,293021.1,293021.1,293021.1,]}]},{elcInfo: [{tableData:[1,293021.1,293021.1,293021.1,293021.1,]}]},{elcInfo: [{tableData:[1,293021.1,293021.1,293021.1,293021.1,]}]},/* {title: "2",elcInfo: [{…

spring-mvc数据绑定和表单标签库(介绍)

spring-mvc数据绑定和表单标签库 1. WEB-INF下页面跳转2. ModelAttribute来注解非请求处理方法3. 表单标签4. 其他标签5. IDEA tomcat控制台中文乱码问题处理 1. WEB-INF下页面跳转 容器启动后,如何默认显示web-inf目录下的系统首页。 2. ModelAttribute来注解非…

mysql生成到当前时间的时间序列,报表按时间补0

生成本月每日的时间序列 SELECT DATE_FORMAT(date_add( CONCAT(YEAR(Date(curdate())),‘-0’,MONTH(Date(curdate())),‘-’,‘01’), INTERVAL ( cast( help_topic_id AS signed) ) DAY ) ,‘%Y-%m-%d’ ) FROM mysql.help_topic WHERE help_topic_id < DAY ( curdate( ) …

示例说明 Makefile 中的 $(@F),及其用法示例$$dir $@ $< $^ %.c

备忘一个不错的开源编辑器CudaText 下载网址&#xff1a; CudaText - Browse /release at SourceForge.net CudaText 主页&#xff1a; CudaText - Home 1&#xff0c;含义及验证 在 Makefile 中&#xff0c;$(F) 表示当前规则的目标文件名&#xff08;不包括路径部分&…

在Linux中使用Apache HTTP服务器

Apache HTTP服务器&#xff0c;也被称为Apache&#xff0c;是全球使用最广泛的Web服务器软件之一。它以其稳定性、强大的功能和灵活性而闻名&#xff0c;尤其在Linux操作系统上表现得尤为出色。以下是关于如何在Linux中使用Apache HTTP服务器的详细指南。 1. 安装Apache 首先…

AI墨墨交流群正式成立:探索科技前沿,共建智能未来

在这个充满变革的时代&#xff0c;AI技术正如涌泉般迸发&#xff0c;带来无限可能。我们深感&#xff0c;唯有汇聚智慧&#xff0c;方能更好地驾驭这股前沿科技的潮流。因此&#xff0c;我们自豪地宣布&#xff1a;AI墨墨交流群正式成立了&#xff01;这不仅是一个交流群&#…

日志系统一(elasticsearch+filebeat+logstash+kibana)

目录 一、es集群部署 安装java环境 部署es集群 安装IK分词器插件 二、filebeat安装&#xff08;docker方式&#xff09; 三、logstash部署 四、kibana部署 背景&#xff1a;因业务需求需要将nginx、java、ingress日志进行收集。 架构&#xff1a;filebeatlogstasheskib…

debug OpenBLAS library 和 应用示例

1. 构建openblas lib git clone gitgithub.com:OpenMathLib/OpenBLAS.git cd OpenBLAS/ 如果要安装在自定义文件夹中&#xff0c;可以修改 PREFIX 的定义&#xff1a; 将 PREFIX /opt/OpenBLAS 修改成 PREFIX ../local/ 然后构建&#xff1a; make -j make install 如果要…

【解决】Unity Project 面板资源显示丢失的异常问题处理

开发平台&#xff1a;Unity 2021.3.7f1c1   一、问题描述 在开发过程中&#xff0c;遭遇 Project 面板资源显示丢失、不全的问题。但 Unity Console 并未发出错误提示。   二、解决方案&#xff1a;删除 Library 目录 前往 “工程目录/Library” 删除内部所有文件并重打开该…

007-可调脉冲数触发之FPGA实现(Zynq也可驱动,带启动停止及完成中断输出)

文章目录 前言一、设计思路二、代码及仿真1.资源消耗2.具体代码3.仿真波形 总结 前言 此代码是在做显微镜高速聚焦系统中自己写的步进电机电机驱动源码&#xff0c;为了达到最快的驱动速度&#xff0c;因此选用脉冲触发方式进行驱动。在电机驱动的过程中往往需要对脉冲进行使能…

React Native 桥接原生实现 JS 调用原生方法

一、为什么需要桥接原生 为了满足在React 层无法实现的需求 复杂高性能的组件&#xff1a;复杂表格、视频播放原生层开发能力&#xff1a;传感器编程、widget平台属性&#xff1a;系统信息、设备信息对接第三方应用&#xff1a;相机、相册、地图 真实的开发过程中是不可能完…

OpenGL学习笔记-Blending

混合方程中&#xff0c;Csource是片段着色器输出的颜色向量&#xff08;the color output of the fragment shader&#xff09;&#xff0c;其权重为Fsource。Cdestination是当前存储在color buffer中的颜色向量&#xff08;the color vector that is currently stored in the …

欢乐的周末 - 华为OD统一考试

OD统一考试 题解&#xff1a; Java / Python / C 题目描述 小华和小为是很要好的朋友&#xff0c;他们约定周末一起吃饭。 通过手机交流&#xff0c;他们在地图上选择了多个聚餐地点(由于自然地形等原因&#xff0c;部分聚餐地点不可达)。求小华和小为都能到达的聚餐地点有多…

私域爆款活动实操指南,让你轻松成为营销高手!

私域运营活动是公司运营中非常重要的一环&#xff0c;它能够提高用户参与度、增加用户忠诚度&#xff0c;并为公司带来更多的商业机会。然而&#xff0c;策划和执行一场成功的私域运营活动并不容易&#xff0c;需要思维缜密、部门合作以及落地能力等方面的综合素养。今天来跟大…

Orchestrator源码解读2-故障失败发现

目录 前言 核心流程函数调用路径 GetReplicationAnalysis 故障类型和对应的处理函数 ​编辑 拓扑结构警告类型 核心流程总结 与MHA相比 前言 Orchestrator另外一个重要的功能是监控集群&#xff0c;发现故障。根据从复制拓扑本身获得的信息&#xff0c;它可以识别各种故…

JDK21和 Flowable 7.0.0

JDK21和 Flowable 7.0.0 一.Flowable二.项目搭建1.依赖包2.数据库3.资源文件1.YML配置文件2.Drools kbase3.Drools rule4.DMN 决策表5.BPMN 流文件 4.BPMN 流程图绘制插件5.测试代码1.启动类2.Flowable 配置3.Camel 配置1.Camel 配置2.Camel Router 定义 4.扩展类监听1.外部工作…