当前位置: 首页 > news >正文

小程序应用、页面、组件生命周期

855cdf03f5ddcf59cfee5677ae9cde6d.jpeg

e741723ffb801dd97ce583cdd5a029ab.jpeg

引言

微信小程序生命周期是指在小程序运行过程中,不同阶段触发的一系列事件和函数。这一概念对于理解小程序的整体架构和开发流程非常重要。本文将介绍小程序生命周期的概念以及在不同阶段触发的关键事件,帮助开发者更好地理解和利用小程序的生命周期。

一、小程序生命周期的概念及核心的构造器

小程序生命周期是指微信小程序从启动到关闭的整个过程中,发生在不同阶段的一系列事件和函数。这些事件和函数可以被开发者用于执行特定的操作,例如初始化数据、加载页面、响应用户交互等。生命周期包括全局生命周期(App 构造器)和页面生命周期(Page 构造器)。

在微信小程序中,App 和 Page 是两个核心的构造器(Constructors),分别用于创建小程序的全局实例和页面实例。2179bac2fe34107a7908d1d0f1e2b19a.jpeg

1、App(全局实例):

App 是一个全局的构造器,用于定义整个小程序的生命周期和全局数据,类似于应用程序的入口。每个小程序都有且只有一个 App 实例。

在 App 构造器中,可以定义全局的生命周期函数(如 onLaunch、onShow、onHide)、全局数据、全局方法等。

App 对象可以用于全局数据的共享和管理,以及在整个小程序生命周期内的操作。

2、Page(页面实例):

Page 构造器用于定义小程序的页面,每个页面都需要使用 Page 构造器创建一个页面实例。一个小程序可以有多个页面。

在 Page 构造器中,可以定义页面的生命周期函数(如 onLoad、onShow、onReady、onHide、onUnload),页面数据、页面方法等。

Page 对象用于管理页面的状态、数据和行为。

二、微信小程序生命周期中的一些关键事件

微信小程序生命周期中的一些关键事件,包括打开页面、离开页面、打开小程序、切换到后台、切换到前台等情况:ce85466a6996ce768729dcd073a25544.jpeg

1、打开页面:

小程序生命周期:

onLaunch:小程序初始化完成时触发。

onShow:小程序启动,或从后台进入前台显示时触发。

页面生命周期:

onLoad:页面加载时触发。

onShow:页面显示时触发。

onReady:页面初次渲染完成时触发。

2、离开页面:

页面生命周期:

onHide:页面从前台进入后台时触发。

onUnload:页面卸载时触发,如redirectTo或navigateBack到其他页面时。

3、打开小程序:

小程序生命周期:

onShow:小程序启动,或从后台进入前台显示时触发。

页面生命周期:

onShow:页面显示时触发。

4、切换到后台:

小程序生命周期:

onHide:小程序从前台进入后台时触发。

页面生命周期:

onHide:页面从前台进入后台时触发。

5、切换到前台:

小程序生命周期:

onShow:小程序启动,或从后台进入前台显示时触发。

页面生命周期:

onShow:页面显示时触发。

这些生命周期函数的触发顺序可以帮助开发者在不同阶段执行特定的操作,如数据加载、页面渲染、清理工作等。通过合理利用这些生命周期函数,可以更好地管理小程序和页面的状态。

三、三个角度介绍生命周期

微信小程序生命周期是指在小程序运行时,不同阶段触发的一系列事件和函数。生命周期包括应用级别的(App),页面级别的(Page),以及组件级别的。这三个角度分别展示了小程序整体、页面和组件在运行过程中的状态变化和可执行的操作。

1、应用生命周期

应用生命周期指的是整个微信小程序从启动到关闭的整个过程中,App 构造器中定义的生命周期函数。这些函数提供了在小程序运行不同阶段执行特定操作的机会,使开发者能够在各个阶段处理相关逻辑。以下是微信小程序的应用生命周期:9794f6aaafbf309650a02b384910ed89.jpeg

(1)onLaunch(启动阶段):

触发时机:小程序初始化完成时触发。

作用:在小程序启动时执行一些初始化操作,获取用户信息、系统信息等。

(2)onShow(显示阶段):

触发时机:小程序启动,或从后台进入前台显示时触发。

作用:用于处理小程序进入前台时的操作,如页面刷新、数据加载等。

(3)onHide(隐藏阶段):

触发时机:小程序从前台进入后台时触发。

作用:用于处理小程序进入后台时的操作,如保存数据、清理定时器等。

(4)onError(错误阶段):

触发时机:小程序发生脚本错误或 API 调用失败时触发。

作用:用于处理小程序运行过程中出现的错误。

(5)onPageNotFound(页面不存在阶段):

触发时机:小程序找不到页面时触发。

作用:用于处理页面找不到的情况,可跳转到自定义的错误页面。

这些生命周期函数允许开发者在不同的阶段执行特定的操作,例如初始化全局数据、处理用户登录状态、进行页面跳转等。通过合理利用这些生命周期函数,开发者可以更好地管理小程序的整体状态和逻辑流程。

2、页面生命周期

微信小程序的页面生命周期是指在一个页面从创建到销毁的整个过程中,Page 构造器中定义的生命周期函数。这些函数提供了在页面不同阶段执行特定操作的机会,使开发者能够在各个阶段处理相关逻辑。以下是微信小程序的页面生命周期:2489191ae2533e2bb0124f6054406e68.jpeg

(1)onLoad(加载阶段):

触发时机:页面加载时触发,一个页面只会触发一次。

作用:用于页面初始化,获取页面参数等。

(2)onShow(显示阶段):

触发时机:页面显示时触发。

作用:用于处理页面显示时的操作,如数据加载、刷新等。

(3)onReady(初次渲染完成阶段):

触发时机:页面初次渲染完成时触发。

作用:用于执行页面渲染完成后的操作,如获取节点信息、动画效果等。

(4)onHide(隐藏阶段):

触发时机:页面从前台进入后台时触发。

作用:用于处理页面进入后台时的操作,如保存数据、清理定时器等。

(5)onUnload(卸载阶段):

触发时机:页面卸载时触发,如redirectTo或navigateBack到其他页面时。

作用:用于执行页面卸载前的操作,如清理数据、取消订阅等。

这些生命周期函数允许开发者在不同的阶段执行特定的操作,例如页面初始化、页面展示、页面渲染完成后的操作等。通过合理利用这些生命周期函数,开发者可以更好地管理页面的状态和逻辑流程。

3、组件生命周期

在微信小程序中,组件生命周期是指在一个自定义组件实例被创建、挂载、更新、卸载等不同阶段触发的一系列生命周期函数。以下是微信小程序自定义组件的生命周期函数:bea74ab3b0e6e09b805f7c8408b635a5.jpeg

(1)created(创建阶段):

触发时机:组件实例被创建时触发。

作用:用于组件实例创建时的初始化操作,通常在这里可以设置组件的初始数据。

(2)attached(挂载阶段):

触发时机:组件被挂载到页面节点树时触发。

作用:在组件被插入到页面节点树时执行的操作,可以进行一些 DOM 操作。

(3)ready(就绪阶段):

触发时机:组件布局完成,也就是组件的位置和尺寸已经计算好时触发。

作用:用于执行一些在组件布局完成后的操作,通常用于获取节点信息等。

(4)moved(移动阶段):

触发时机:组件被移动到另外一个位置时触发。

作用:在组件被移动到另一个位置时执行的操作。

(5)detached(卸载阶段):

触发时机:组件实例被从页面节点树中移除时触发。

作用:在组件被销毁前执行的操作,可以进行一些清理工作,如取消订阅、清理定时器等。

这些生命周期函数为开发者提供了在组件不同阶段执行特定操作的机会,使得开发者能够更好地管理组件的状态和行为。在实际开发中,可以利用这些生命周期函数来进行组件的初始化、数据绑定、事件处理等操作。

结语

小程序生命周期从应用、页面到组件,形成了一个层层嵌套的结构。这三个层次的生命周期分别管理了整个小程序、单个页面和自定义组件的运行时序,为开发者提供了灵活而有力的控制和操作机会。通过深入理解小程序生命周期,开发者能够更好地优化程序性能、管理数据状态,从而提升用户体验。


相关文章:

小程序应用、页面、组件生命周期

引言 微信小程序生命周期是指在小程序运行过程中,不同阶段触发的一系列事件和函数。这一概念对于理解小程序的整体架构和开发流程非常重要。本文将介绍小程序生命周期的概念以及在不同阶段触发的关键事件,帮助开发者更好地理解和利用小程序的生命周期。 …...

Springboot中如何记录好日志

Springboot中如何记录日志 日志体系整体介绍 日志一直在系统中占据这十分重要的地位,他是我们在系统发生故障时用来排查问题的利器,也是我们做操作审计的重要依据。那么如何记录好日志呢?选择什么框架来记录日志,是不是日志打越…...

vm 虚拟机中ubuntu环境配置共享文件夹的方式

1. 在虚拟机设置中启用共享文件夹选项,映射到Windows中具体的目录。 2. 启动虚拟机。 3. 挂在cd #查看cd设备文件 sudo blkid#创建挂载点 sudo mkdir -p /media/cdrom#挂载cd sudo mount /dev/sr0 /media/cdrom#卸载cd sudo umount /media/cdrom 4. 执行完挂载后…...

EMQX Enterprise 5.5 发布:新增 Elasticsearch 数据集成

EMQX Enterprise 5.5.0 版本已正式发布! 在这个版本中,我们引入了一系列新的功能和改进,包括对 Elasticsearch 的集成、Apache IoTDB 和 OpenTSDB 数据集成优化、授权缓存支持排除主题等功能。此外,新版本还进行了多项改进以及 B…...

安全架构设计理论与实践

一、考点分布 安全架构概述(※※)安全模型(※※※)信息安全整体架构设计网络安全体系架构设计区块链技术(※※) 二、安全架构概述 被动攻击:收集信息为主,破坏保密性 主动攻击&#…...

SQL注入漏洞解析--less-46

我们先看一下46关 他说让我们先输入一个数字作为sort,那我们就先输入数字看一下 当我们分别输入1,2,3可以看到按照字母顺序进行了排序,所以它便是一个使用了order by语句进行排序的查询的一种查询输出方式 当输入时出现报错提示,说…...

【算法与数据结构】回溯算法、贪心算法、动态规划、图论(笔记三)

文章目录 七、回溯算法八、贪心算法九、动态规划9.1 背包问题9.2 01背包9.3 完全背包9.4 多重背包 十、图论10.1 深度优先搜索10.2 广度优先搜索10.3 并查集 最近博主学习了算法与数据结构的一些视频,在这个文章做一些笔记和心得,本篇文章就写了一些基础…...

【pytorch】常用代码

文章目录 条件与概率torch.tensor()torch.rand()torch.randn()torch.randint()torch.multinominal() 逻辑运算torch.argmax()torch.max()torch.sum()torch.tanh()torch.pow() 功能性操作 torch.nn.functionalF.normalize()F.elu()F.relu()F.softmax() 张量计算torch.zeros()tor…...

GB28181 —— Ubuntu20.04下使用ZLMediaKit+WVP搭建GB28181流媒体监控平台(连接带云台摄像机)

最终效果 简介 GB28181协议是视频监控领域的国家标准。该标准规定了公共安全视频监控联网系统的互联结构, 传输、交换、控制的基本要求和安全性要求, 以及控制、传输流程和协议接口等技术要求,是视频监控领域的国家标准。GB28181协议信令层面使用的是SIP(Session Initiatio…...

图片录入设备、方式与质量对图片转Excel的影响

随着数字化时代的到来,图片已经成为人们日常生活中不可或缺的一部分。在各行各业中,图片的应用越发广泛,从而促使了图片处理技术的快速发展。然而,图片的质量对于后续数据处理和分析的准确性和可靠性有着至关重要的影响。本文将从…...

Linux:ACL权限,特殊位和隐藏属性

目录 一.什么是ACL 二.操作步骤 ① 添加测试目录、用户、组,并将用户添加到组 ② 修改目录的所有者和所属组 ③ 设定权限 ④ 为临时用户分配权限 ⑤ 验证acl权限 ⑥ 控制组的acl权限 三. 删除ACL权限 一.什么是ACL 访问控制列表 (Access Control List):ACL 通…...

FL Studio21中文版本价格多少?值不值得购买?

FL Studio,也被称为Fruity Loops,是一款非常受欢迎的数字音频工作站(DAW),适合广泛的音乐制作人群使用。以下是适合使用FL Studio的人群: 初学者:FL Studio拥有直观且用户友好的界面&#xff0c…...

【论文阅读】ICCV 2023 计算和数据高效后门攻击

文章目录 一.论文信息二.论文内容1.摘要2.引言3.主要图表4.结论 一.论文信息 论文题目: Computation and Data Efficient Backdoor Attacks(计算和数据高效后门攻击) 论文来源: 2023-ICCV(CCF-A) 论文团…...

JavaAPI常用类03

目录 java.lang.Math Math类 代码 运行 Random类 代码 运行 Date类/Calendar类/ SimpleDateFormat类 Date类 代码 运行 Calendar类 代码 运行 SimpleDateFormat类 代码一 运行 常用的转换符 代码二 运行 java.math BigInteger 代码 运行 BigDecimal …...

SpringBoot/Java中OCR实现,集成Tess4J实现图片文字识别

场景 Tesseract Tesseract是一个开源的光学字符识别(OCR)引擎,它可以将图像中的文字转换为计算机可读的文本。 支持多种语言和书面语言,并且可以在命令行中执行。它是一个流行的开源OCR工具,可以在许多不同的操作系…...

【深度学习目标检测】十九、基于深度学习的芒果计数分割系统-含数据集、GUI和源码(python,yolov8)

使用深度学习算法检测芒果具有显著的优势和应用价值。以下是几个主要原因: 特征学习的能力:深度学习,特别是卷积神经网络(CNN),能够从大量的芒果图像中自动学习和提取特征。这些特征可能是传统方法难以手动…...

骑砍战团MOD开发(48)-多人联机模式开发环境搭建

一.多人联机模式网络拓扑图 <1.局域网网络拓扑图 <2.互联网网络拓扑图 二.多人联机模式配置 MOD目录下module.ini修改配置项 has_multiplayer 1 has_single_player 1 三.服务端创建 引擎内置presentation页面: prsnt_game_multiplayer_admin_panel start_multi…...

Java+SpringBoot+Vue+MySQL:美食推荐系统的技术革新

✍✍计算机编程指导师 ⭐⭐个人介绍&#xff1a;自己非常喜欢研究技术问题&#xff01;专业做Java、Python、微信小程序、安卓、大数据、爬虫、Golang、大屏等实战项目。 ⛽⛽实战项目&#xff1a;有源码或者技术上的问题欢迎在评论区一起讨论交流&#xff01; ⚡⚡ Java实战 |…...

【服务发现--ingress】

1、ingress介绍 Ingress 提供从集群外部到集群内服务的 HTTP 和 HTTPS 路由。 流量路由由 Ingress 资源所定义的规则来控制。 Ingress 是对集群中服务的外部访问进行管理的 API 对象&#xff0c;典型的访问方式是 HTTP。 Ingress 可以提供负载均衡、SSL 终结和基于名称的虚拟…...

Yolov8有效涨点:YOLOv8-AM,添加多种注意力模块提高检测精度,含代码,超详细

前言 2023 年&#xff0c;Ultralytics 推出了最新版本的 YOLO 模型。注意力机制是提高模型性能最热门的方法之一。 本次介绍的是YOLOv8-AM&#xff0c;它将注意力机制融入到原始的YOLOv8架构中。具体来说&#xff0c;我们分别采用四个注意力模块&#xff1a;卷积块注意力模块…...

铭豹扩展坞 USB转网口 突然无法识别解决方法

当 USB 转网口扩展坞在一台笔记本上无法识别,但在其他电脑上正常工作时,问题通常出在笔记本自身或其与扩展坞的兼容性上。以下是系统化的定位思路和排查步骤,帮助你快速找到故障原因: 背景: 一个M-pard(铭豹)扩展坞的网卡突然无法识别了,扩展出来的三个USB接口正常。…...

从WWDC看苹果产品发展的规律

WWDC 是苹果公司一年一度面向全球开发者的盛会&#xff0c;其主题演讲展现了苹果在产品设计、技术路线、用户体验和生态系统构建上的核心理念与演进脉络。我们借助 ChatGPT Deep Research 工具&#xff0c;对过去十年 WWDC 主题演讲内容进行了系统化分析&#xff0c;形成了这份…...

ESP32读取DHT11温湿度数据

芯片&#xff1a;ESP32 环境&#xff1a;Arduino 一、安装DHT11传感器库 红框的库&#xff0c;别安装错了 二、代码 注意&#xff0c;DATA口要连接在D15上 #include "DHT.h" // 包含DHT库#define DHTPIN 15 // 定义DHT11数据引脚连接到ESP32的GPIO15 #define D…...

OkHttp 中实现断点续传 demo

在 OkHttp 中实现断点续传主要通过以下步骤完成&#xff0c;核心是利用 HTTP 协议的 Range 请求头指定下载范围&#xff1a; 实现原理 Range 请求头&#xff1a;向服务器请求文件的特定字节范围&#xff08;如 Range: bytes1024-&#xff09; 本地文件记录&#xff1a;保存已…...

【7色560页】职场可视化逻辑图高级数据分析PPT模版

7种色调职场工作汇报PPT&#xff0c;橙蓝、黑红、红蓝、蓝橙灰、浅蓝、浅绿、深蓝七种色调模版 【7色560页】职场可视化逻辑图高级数据分析PPT模版&#xff1a;职场可视化逻辑图分析PPT模版https://pan.quark.cn/s/78aeabbd92d1...

Mysql中select查询语句的执行过程

目录 1、介绍 1.1、组件介绍 1.2、Sql执行顺序 2、执行流程 2.1. 连接与认证 2.2. 查询缓存 2.3. 语法解析&#xff08;Parser&#xff09; 2.4、执行sql 1. 预处理&#xff08;Preprocessor&#xff09; 2. 查询优化器&#xff08;Optimizer&#xff09; 3. 执行器…...

排序算法总结(C++)

目录 一、稳定性二、排序算法选择、冒泡、插入排序归并排序随机快速排序堆排序基数排序计数排序 三、总结 一、稳定性 排序算法的稳定性是指&#xff1a;同样大小的样本 **&#xff08;同样大小的数据&#xff09;**在排序之后不会改变原始的相对次序。 稳定性对基础类型对象…...

Oracle11g安装包

Oracle 11g安装包 适用于windows系统&#xff0c;64位 下载路径 oracle 11g 安装包...

mac:大模型系列测试

0 MAC 前几天经过学生优惠以及国补17K入手了mac studio,然后这两天亲自测试其模型行运用能力如何&#xff0c;是否支持微调、推理速度等能力。下面进入正文。 1 mac 与 unsloth 按照下面的进行安装以及测试&#xff0c;是可以跑通文章里面的代码。训练速度也是很快的。 注意…...

WEB3全栈开发——面试专业技能点P7前端与链上集成

一、Next.js技术栈 ✅ 概念介绍 Next.js 是一个基于 React 的 服务端渲染&#xff08;SSR&#xff09;与静态网站生成&#xff08;SSG&#xff09; 框架&#xff0c;由 Vercel 开发。它简化了构建生产级 React 应用的过程&#xff0c;并内置了很多特性&#xff1a; ✅ 文件系…...