页面、组件、应用、生命周期(微信小程序)
文章目录
- 页面生命周期函数
- 组件生命周期函数
- 应用(App)生命周期函数
- 页面与组件生命周期的执行顺序
- 注意事项
在微信小程序中,生命周期函数是指页面或组件在不同阶段会被自动调用的特定函数。这些函数可以帮助开发者在适当的时机完成特定的初始化、清理或交互逻辑。
页面生命周期函数
页面生命周期函数是作用于小程序中的页面,处理页面加载、显示、隐藏等事件。
| 函数名 | 描述 |
|---|---|
onLoad(options) | 页面加载时触发,参数为打开当前页面路径中的参数。 |
onShow() | 页面显示时触发,每次进入页面都会执行。 |
onReady() | 页面初次渲染完成时触发,仅执行一次。 |
onHide() | 页面被隐藏时触发,如跳转到其他页面或切入后台。 |
onUnload() | 页面卸载时触发,如关闭当前页面或返回上一页。 |
onPullDownRefresh() | 监听用户下拉刷新动作,需在 app.json 中开启 "enablePullDownRefresh"。 |
onReachBottom() | 监听页面触底事件,如用于加载更多数据。 |
onPageScroll() | 监听页面滚动,参数为滚动距离(单位 px)。 |
onShareAppMessage(options) | 用户点击右上角分享时触发,可自定义分享内容。 |
onShareTimeline() | 用户点击分享按钮分享到朋友圈时触发(需要设置 enableShareTimeline)。 |
onAddToFavorites() | 用户点击收藏时触发,需设置 enableAddToFavorites 为 true。 |
onResize() | 监听页面尺寸变化,如屏幕旋转(横竖屏切换)。 |
onTabItemTap(item) | 监听点击 tab 时触发,仅在 tab 页面有效。 |
组件生命周期函数
组件生命周期函数用于处理组件的创建、更新、销毁等阶段的事件。
| 函数名 | 描述 |
|---|---|
created() | 在组件实例刚刚被创建时触发。 |
attached() | 在组件实例进入页面节点树时触发。 |
ready() | 在组件布局完成后触发,可以操作 DOM 节点。 |
moved() | 在组件实例被移动到其他位置时触发。 |
detached() | 在组件实例被从页面节点树移除时触发。 |
error(error) | 当组件方法抛出错误时触发,参数为错误信息。 |
lifetimes.show() | 组件被展示时触发(支持页面级别的监听)。 |
lifetimes.hide() | 组件被隐藏时触发(支持页面级别的监听)。 |
lifetimes.resize() | 监听组件尺寸变化。 |
应用(App)生命周期函数
应用生命周期函数用于处理小程序的整体生命周期,主要是小程序的启动、切换前后台等。
| 函数名 | 描述 |
|---|---|
onLaunch(options) | 小程序初始化时触发,全局只触发一次。 |
onShow(options) | 小程序启动或从后台进入前台时触发。 |
onHide() | 小程序从前台进入后台时触发。 |
onError(error) | 小程序发生脚本错误或 API 调用失败时触发。 |
onUnhandledRejection(reason) | 未处理的 Promise 拒绝触发。 |
onPageNotFound(options) | 当页面不存在时触发,可进行页面跳转(最多触发一次)。 |
onThemeChange(theme) | 小程序主题发生变化时触发,参数为主题信息。 |
onUnhandledRejection(reason) | 未捕获的 Promise 错误触发,参数为错误原因。 |
页面与组件生命周期的执行顺序
- 页面首次加载时
App.onLaunch->App.onShow->Page.onLoad->Page.onShow->Page.onReady
- 页面切换
- 离开页面:
Page.onHide - 新页面加载:
Page.onLoad->Page.onShow->Page.onReady
- 离开页面:
- 页面卸载
Page.onUnload
- 小程序切后台
Page.onHide->App.onHide
- 小程序切回前台
App.onShow->Page.onShow
注意事项
-
onPullDownRefresh和onReachBottom- 需要在
app.json或page.json中配置相应的功能开关。 - 在数据加载完成后,需调用
wx.stopPullDownRefresh()停止刷新动画。
- 需要在
-
onShareAppMessage- 如果未定义该方法,分享时将无法自定义内容,显示默认的页面标题和链接。
-
onPageNotFound- 必须在
App的配置中设置"entryPagePath"否则可能不会触发。
- 必须在
-
组件生命周期
- 对于组件与页面交互,需要关注组件的
attached和detached阶段,以进行初始化和清理操作。
- 对于组件与页面交互,需要关注组件的
通过合理利用生命周期函数,可以更高效地管理小程序的状态和资源,提高开发体验和用户体验。

相关文章:
页面、组件、应用、生命周期(微信小程序)
文章目录 页面生命周期函数组件生命周期函数应用(App)生命周期函数页面与组件生命周期的执行顺序注意事项 在微信小程序中,生命周期函数是指页面或组件在不同阶段会被自动调用的特定函数。这些函数可以帮助开发者在适当的时机完成特定的初始化…...
书生第四期实训营进阶岛——L2G4000 InternVL 多模态模型部署微调实践
基础任务 体验InternVL 运行demo 效果如下: 使用XTuner对InternVL进行微调 运行demo 效果如下:...
国内 ChatGPT中文版镜像网站整理合集(2024/11/08)
一、GPT中文镜像站 ① yixiaai.com 支持GPT4、4o以及o1,支持MJ绘画 ② chat.lify.vip 支持通用全模型,支持文件读取、插件、绘画、AIPPT ③ AI Chat 支持GPT3.5/4,4o以及MJ绘画 1. 什么是镜像站 镜像站(Mirror Siteÿ…...
SpringBoot整合Liquibase对数据库管理和迁移
简介 Liquibase是一个用于用于跟踪、管理和应用数据库变化的开源工具,通过日志文件(changelog)的形式记录数据库的变更(changeset),然后执行日志文件中的修改,将数据库更新或回滚(rollback)到一致的状态。它的目标是提供一种数据库类型无关的…...
太空旅游:科技能否让星辰大海变为现实?
内容概要 在这个快速变化的时代,太空旅游成为了一个让人热血沸腾的话题。想象一下,坐在一颗漂浮的太空舱里,手中端着饮料,眺望着无尽的星辰大海,简直就像科幻电影中的情节一样。不过,这不仅仅是一个空洞的…...
[JAVAEE] 面试题(四) - 多线程下使用ArrayList涉及到的线程安全问题及解决
目录 一. 多线程下使用ArrayList 1.1. 自行判断加锁 1.2 使用Collections.synchronizedList()套壳加锁 1.3 CopyOnWriteArrayList类 二. 总结 一. 多线程下使用ArrayList 多线程下使用ArrayList会涉及到线程安全问题, 例如: public static void main(String[] args) thro…...
Elasticsearch-linux环境部署
本文主要介绍linux下elasticsearch的部署。通过在一台linux服务器中分别对elasticsearch-6.7.2版本,elasticsearch-7.3.0版本来进行安装,记录在安装elasticsearch-7.3.0版本时出现的异常情况,以及elasticsearch-head的安装。 基础环境 本机已…...
LeetCode 每日一题 长度为 K 的子数组的能量值
长度为 K 的子数组的能量值 给你一个长度为 n 的整数数组 nums 和一个正整数 k 。 一个数组的 能量值 定义为: 如果 所有 元素都是依次 连续 且 上升 的,那么能量值为 最大 的元素。 否则为 -1 。 你需要求出 nums 中所有长度为 k 的 子数组 的能量值。 …...
人工智能——小白学习指南
知孤云出岫 目录 1. **智能评测系统**2. **个性化学习路径推荐**3. **虚拟学习助手**4. **学习行为分析**5. **数据驱动的教学决策**6. **自动化课程推荐**7. **数据隐私与安全保护** 人工智能知识点的总结和学习路线,以数据表格形式呈现,并附带在教育行…...
go 集成Gin Web开发框架
引入gin的依赖 下载并安装 gin go get -u github.com/gin-gonic/gin 将 gin 引入到代码中 import "github.com/gin-gonic/gin" 开始 package mainimport "github.com/gin-gonic/gin"func main() {r : gin.Default()r.GET("/ping", func(c …...
c++ 多态性
类的多态 多态概念入门 #include <iostream> using namespace std;/* 多态的前提: 拥有继承关系的类中有相同的函数(返回类型、函数名、形参列表) 多态解决的问题:1、派生类的对象被赋值给基类对象时2、派生类的对象初始化基类的引用时3、基类的指针指向派生…...
块存储、文件存储和对象存储详细介绍
块存储、文件存储和对象存储介绍 块存储:像跑车,因为它们都能提供快速的响应和高性能,适合需要即时数据访问的场景,比如数据库和虚拟化技术。 文件存储:像货车,因为它们都能承载大量货物(文件&…...
移植 AWTK 到 纯血鸿蒙 (HarmonyOS NEXT) 系统 (9) - 编译现有的AWTK应用程序
AWTK 应用程序开发完成后,在配置文件中添加 harmonyos 的选项,通过create_project.py脚本即可生成 DevEco Studio的工程。 安装开发环境 DevEco Studio HarmonyOS 的开发工具。 Python 运行环境。 git 源码管理工具。 下载 awtk 和 awtk-harmonyos…...
ssm基于BS的仓库在线管理系统的设计与实现+vue
系统包含:源码论文 所用技术:SpringBootVueSSMMybatisMysql 免费提供给大家参考或者学习,获取源码看文章最下面 需要定制看文章最下面 目 录 第一章 绪论 1 1.1 研究背景 1 1.2 研究意义 1 1.3 研究内容 2 第二章 开发环境与技术3 …...
面试题:Spring(一)
1. Spring框架中bean是单例么? Service Scope("singleton") public class UserServiceImpl implements UserService { }singleton : bean在每个Spring IOC容器中只有一个实例。prototype:一个bean的定义可以有多个实例。 2. Spring框架中的…...
MySQ怎么使用语法介绍(详细)
一、什么是库结构 库结构的意思就是指数据库的结构。所以,理解“库结构”就要先理解“库”是什么。 在数据库的上下文中,库指的是一个数据库。简单来说,数据库(库)是用来存储和管理数据的容器。它不仅存储实际的数据…...
新能源汽车与公共充电桩布局
近年来,全球范围内对新能源汽车产业的推动力度不断增强,中国新能源汽车市场也呈现蓬勃发展的势头,在政策与市场的共同推动下,新能源汽车销量持续增长。然而,据中国充电联盟数据显示,充电基础设施建设滞后于新能源汽车数量增长的现状导致充电桩供需不平衡,公共充电桩服务空白区域…...
【GIT】sourceTree的“当前分支“,“合并分支“与“检出分支的区别
GIT三款经典可视化 由上文文档得出灵感写出此篇 这三个概念在 Git 操作中都是很常见的, 来逐个解析: 1. 当前分支 “当前分支”就是你目前正在工作的分支。你在进行任何代码修改、提交等操作时,都会应用到“当前分支”上。换句话说…...
【Git】如何在 Git 中高效合并分支:完整指南
目录 引言1. 切换到主分支1.1 切换分支命令1.2 相关命令1.3 切换分支示意图 2. 合并分支2.1 基本合并命令2.2 合并选项2.3 合并流程示意图 3. 解决冲突3.1 解决冲突的步骤3.2 相关命令3.3 解决冲突示意图 4. 本地更新分支4.1 拉取远程更改4.2 更新主分支4.3 拉取远程更新到本地…...
成都睿明智科技有限公司抖音电商服务效果如何?
在这个短视频风起云涌的时代,抖音电商以其独特的魅力,成为了众多商家竞相追逐的新蓝海。而在这片波澜壮阔的商海中,成都睿明智科技有限公司犹如一艘稳健的航船,引领着无数企业驶向成功的彼岸。今天,就让我们一起揭开成…...
3个技巧让桌游卡牌设计效率提升5倍:EZCard自动化工具深度解析
3个技巧让桌游卡牌设计效率提升5倍:EZCard自动化工具深度解析 【免费下载链接】CardEditor 一款专为桌游设计师开发的批处理数值填入卡牌生成器/A card batch generator specially developed for board game designers 项目地址: https://gitcode.com/gh_mirrors/…...
LRC Maker终极指南:3分钟学会制作专业滚动歌词的免费神器
LRC Maker终极指南:3分钟学会制作专业滚动歌词的免费神器 【免费下载链接】lrc-maker 歌词滚动姬|可能是你所能见到的最好用的歌词制作工具 项目地址: https://gitcode.com/gh_mirrors/lr/lrc-maker 还在为歌词与音乐不同步而烦恼吗?想…...
手把手调优:如何榨干寒武纪MLU370系列卡的每一份算力?
寒武纪MLU370算力压榨实战:从芯片架构到BANG编程的深度调优指南 当一张价值数十万元的AI加速卡在数据中心里以30%的利用率运行时,每个周期都在烧掉本该属于企业的利润。寒武纪MLU370系列作为国产AI加速卡的代表作,其真实算力潜力往往被大多数…...
pycharm接入AI大模型测试脚本费用说明
费用说明 阿里云通义千问提供: 新用户免费额度:注册即送一定额度的免费 tokens 按量付费:用多少付多少,无最低消费 价格透明:详见 官方定价 示例成本(以 qwen-plus 为例) 解析-个 100页 PDF≈ 50,000 tokens ≈0.4 生成 100 个问答对≈20,000 tokens ≈0.16 下一步 …...
从人脸变形到地形编辑:拆解RBF(径向基函数)在游戏与仿真中的另类用法
从人脸变形到地形编辑:拆解RBF(径向基函数)在游戏与仿真中的另类用法 当游戏角色面部需要自然扭曲表情时,当虚拟地形需要实时生成连绵山脉时,图形开发者们往往面临同一个数学挑战:如何用少量控制点驱动复杂…...
解决Arm Compiler许可证平台不匹配错误(FLEXnet -89)
1. 问题现象与背景解析 最近在调试基于Arm架构的嵌入式系统时,遇到了一个棘手的许可证错误。当尝试使用Arm Compiler 6进行代码编译时,突然弹出了以下错误信息: Error: C3397E: Cannot obtain license for Arm_Compiler (feature compiler)…...
WeChatExporter终极指南:三步破解iOS微信数据备份的技术迷思
WeChatExporter终极指南:三步破解iOS微信数据备份的技术迷思 【免费下载链接】WeChatExporter 一个可以快速导出、查看你的微信聊天记录的工具 项目地址: https://gitcode.com/gh_mirrors/wec/WeChatExporter 你是否曾因误删重要微信聊天记录而懊恼不已&…...
巅峰共鸣,实力同频|盖茨中国热烈祝贺张雪机车WSBK捷克站双冠耀世,改写37年垄断史!
引擎轰鸣震彻赛道,中国红闪耀世界舞台!2026 年 5 月 17 日,WSBK 捷克莫斯特站 WorldSSP 组别圆满落幕,中国品牌张雪机车再创历史,车手 Valentin Debise 驾驶自研 ZX820RR 赛车,包揽两回合冠军,斩…...
NotebookLM+遥感影像分析实战:水稻倒伏预警模型搭建(含Landsat-8元数据自动标注技巧)
更多请点击: https://kaifayun.com 第一章:NotebookLM农业科学研究 NotebookLM 是 Google 推出的基于 AI 的研究协作者工具,专为知识密集型工作设计。在农业科学研究中,它能高效整合多源异构文献(如 FAO 报告、PubMed…...
【NotebookLM新闻传播研究权威指南】:20年传媒技术专家亲授AI驱动的新闻生产新范式
更多请点击: https://kaifayun.com 第一章:NotebookLM新闻传播研究导论 NotebookLM 是 Google 推出的基于大型语言模型的实验性研究助手,专为信息整合、溯源验证与知识重构设计。其核心能力在于对用户上传的文档(PDF、TXT、网页…...
