uniapp的生命周期
在 UniApp 中,生命周期函数是指在组件(如页面、视图等)创建和销毁过程中会自动触发的一些函数。UniApp 提供了多种生命周期函数,帮助开发者在适当的时机进行相关的逻辑处理。
UniApp 的生命周期函数可以分为 页面生命周期 和 组件生命周期 两类。以下是详细的介绍:
一、页面生命周期
页面生命周期指的是每个页面从加载、显示到销毁的整个过程。
-
onLoad
页面加载时触发,参数options包含了页面的启动参数。
适用于:获取页面传递的参数,初始化页面数据等。javascript
-
onLoad(options) {console.log('页面加载', options); } -
onShow
页面每次显示时触发。
适用于:页面显示时需要刷新数据或处理一些界面相关的逻辑。javascript
-
onShow() {console.log('页面显示'); } -
onReady
页面首次渲染完成时触发。
适用于:页面渲染完成后的一些处理,通常用于 DOM 操作等。javascript
-
onReady() {console.log('页面渲染完成'); } -
onHide
页面隐藏时触发(如进入后台、页面跳转)。
适用于:暂停或保存状态,避免一些不必要的操作。javascript
-
onHide() {console.log('页面隐藏'); } -
onUnload
页面卸载时触发(如页面被销毁,用户离开页面)。
适用于:页面销毁时进行清理操作,如清除定时器、取消订阅等。javascript
-
onUnload() {console.log('页面卸载'); } -
onPullDownRefresh
用户下拉页面时触发。
适用于:刷新页面内容。javascript
-
onPullDownRefresh() {console.log('页面下拉刷新'); } -
onReachBottom
页面触底时触发。
适用于:加载更多数据。javascript
-
onReachBottom() {console.log('页面触底'); } -
onPageScroll
页面滚动时触发。
适用于:监听滚动位置变化,执行页面滚动相关操作。javascript
-
onPageScroll(e) {console.log('页面滚动', e); } -
onShareAppMessage
用户点击分享按钮时触发。
适用于:定制分享内容。javascript
-
onShareAppMessage() {return {title: '分享标题',path: '/pages/index/index',}; }
二、组件生命周期
组件生命周期是指 UniApp 中自定义组件的生命周期函数。它分为 组件创建、组件显示、组件销毁 等过程。
-
created
组件实例化时触发。
适用于:初始化组件的状态,执行数据请求等。javascript
-
created() {console.log('组件创建'); } -
attached
组件挂载到页面时触发。
适用于:DOM 节点已渲染,适合进行操作和监听事件。javascript
-
attached() {console.log('组件挂载'); } -
ready
组件渲染完成后触发。
适用于:执行需要访问组件节点的方法,如获取元素尺寸等。javascript
-
ready() {console.log('组件渲染完成'); } -
moved
组件被移动到节点树中时触发。
适用于:处理组件位置变动时的逻辑。javascript
-
moved() {console.log('组件已移动'); } -
detached
组件从页面卸载时触发。
适用于:清理定时器、事件监听器等资源。javascript
-
detached() {console.log('组件卸载'); }
三、全局生命周期
UniApp 中还可以使用一些全局生命周期函数来管理应用程序的状态:
-
onLaunch
应用启动时触发。
适用于:全局初始化操作、获取用户信息等。javascript
-
onLaunch() {console.log('应用启动'); } -
onShow
应用每次显示时触发。
适用于:应用从后台回到前台时进行的一些逻辑处理。javascript
-
onShow() {console.log('应用显示'); } -
onHide
应用每次隐藏时触发。
适用于:应用进入后台时,暂停相关操作等。javascript
-
onHide() {console.log('应用隐藏'); } -
onError
全局错误捕获。
适用于:捕获并处理应用运行时的错误。javascript
-
onError(msg) {console.log('应用发生错误:', msg); } -
onPageNotFound
页面不存在时触发。
适用于:自定义 404 页面或处理页面跳转失败等。javascript
-
onPageNotFound() {console.log('页面不存在'); }
总结
UniApp 的生命周期函数为开发者提供了丰富的钩子,可以在不同的时间点处理相应的逻辑。页面生命周期主要包括页面加载、显示、隐藏和卸载等阶段,而组件生命周期则处理组件的创建、挂载、渲染和销毁等。合理利用这些生命周期函数,可以更高效地开发 UniApp 应用,提升应用的性能和用户体验。
相关文章:
uniapp的生命周期
在 UniApp 中,生命周期函数是指在组件(如页面、视图等)创建和销毁过程中会自动触发的一些函数。UniApp 提供了多种生命周期函数,帮助开发者在适当的时机进行相关的逻辑处理。 UniApp 的生命周期函数可以分为 页面生命周期 和 组件…...
基于 RNN(GRU, LSTM)+CNN 的红点位置检测(pytorch)
文章目录 1 项目背景2 数据集3 思路4 实验结果5 代码 1 项目背景 需要在图片精确识别三跟红线所在的位置,并输出这三个像素的位置。 其中,每跟红线占据不止一个像素,并且像素颜色也并不是饱和度和亮度极高的红黑配色,每个红线放大…...
L2G3000-LMDeploy 量化部署实践
文章目录 LMDeploy 量化部署实践闯关任务环境配置W4A16 量化 KV cacheKV cache 量化Function call LMDeploy 量化部署实践闯关任务 环境配置 conda create -n lmdeploy python3.10 -y conda activate lmdeploy conda install pytorch2.1.2 torchvision0.16.2 torchaudio2.1.…...
verilog编程规范
verilog编程规范 文章目录 verilog编程规范前言一、代码划分二、verilog编码ABCDEFG 前言 高内聚,低耦合,干净清爽的代码 一、代码划分 高内聚: 一个功能一个模块干净的接口提取公共的代码 低耦合: 模块之间低耦合尽量用少量…...
飞飞5.4游戏源码(客户端+服务端+工具完整源代码+5.3fix+5.4patch+数据库可编译进游戏)
飞飞5.4游戏源码(客户端服务端工具完整源代码5.3fix5.4patch数据库可编译进游戏) 下载地址: 通过网盘分享的文件:【源码】飞飞5.4游戏源码(客户端服务端工具完整源代码5.3fix5.4patch数据库可编译进游戏) 链…...
【MySQL】——用一文领悟表的增删查改
目录 前言 🍃1.表的增加 🍙1.1增——insert 🍙1.2插入否则更新 🍤1.2.1影响行说明 🍂2.表的查询 🍘2.1查询——select 🍘2.2特殊表查询 🍥2.2.1添加表达式 🍥…...
Zabbix监控Oracle 19c数据库完整配置指南
Zabbix监控Oracle 19c数据库完整配置指南 本文将详细介绍如何使用Zabbix配置Oracle 19c数据库监控,包括安装、配置、问题排查等全过程。本指南适合新手独立完成配置。 1. 环境准备 1.1 系统要求 Oracle 19c数据库服务器Zabbix服务器(版本5.0或更高&a…...
静态路由与交换机配置实验
1.建立网络拓扑 添加2台计算机,标签名为PC0、PC1;添加2台二层交换机2960,标签名为S0、S1;添加2台路由器2811,标签名为R0、R1;交换机划分的VLAN及端口根据如下拓扑图,使用直通线、DCE串口线连接…...
【jvm】讲讲jvm中的gc
目录 1. 说明2. 主要算法2.1 标记-清除算法2.2 复制算法2.3 标记-整理算法3. 主要回收器3.1 Serial GC3.2 Parallel GC3.3 CMS(Concurrent Mark-Sweep)GC3.4 G1(Garbage-First)GC 4. 触发条件4.1 Minor GC(Young GC&am…...
openlayers地图事件
OpenLayers是一个开源的JavaScript库,用于在Web上创建交互式地图。它提供了许多地图事件,使用户可以与地图进行交互。以下是OpenLayers常用的地图事件: 1. click:当用户单击地图时触发该事件。 2. dblclick:当用户双…...
杂记9---一些场景git操作汇总
背景:不同项目需求,所需要git操作集合,不太一样,这里汇总记录一下。 场景1:给本地项目添加到远程仓库的新建分支上 把本地节点保存在自己库的一个分支: git init git remote add origin xxx.git 远程仓库…...
Mysql索引,聚簇索引,非聚簇索引,回表查询
什么是索引 数据库索引是为了实现高效数据查询的一种有序的数据数据结构,类似于书的目录,通过目录可以快速的定位到想要的数据,因为一张表中的数据会有很多,如果直接去表中检索数据效率会很低,所以需要为表中的数据建立…...
【优选算法 二分查找】二分查找算法入门详解:二分查找小专题
x 的平方根 题目解析 算法原理 解法一: 暴力解法 如果要求一个数(x)的平方根,可以从 0 往后枚举,直到有一个数(a),a^2<x,(a1)^2>x,a即为所求; 解法二:二分查找 …...
如何将CSDN博客下载为PDF文件
1.打开CSDN文章内容 2.按键盘上的f12键(或者右键—审查元素)进入浏览器调试模式,点击控制台(Console)进入控制台 3.在控制台输入以下代码,回车 4.在弹出的打印页面中将布局设置成横向,纵向会…...
pdf转word/markdown等格式——MinerU的部署:2024最新的智能数据提取工具
一、简介 MinerU是开源、高质量的数据提取工具,支持多源数据、深度挖掘、自定义规则、快速提取等。含数据采集、处理、存储模块及用户界面,适用于学术、商业、金融、法律等多领域,提高数据获取效率。一站式、开源、高质量的数据提取工具&…...
2024年下半年网络工程师案例分析真题及答案解析
2024年下半年网络工程师案例分析真题及答案解析 试题一(15分) [说明] 公司为某科技园区的不同企业提供网络服务,不同企业的业务有所不同,每个企业因业务需要在不同的地点有多个分支机构。其拓扑结构如图1所示。企业用户通过楼层接入交换机、楼栋汇聚交换机和区域交换机接…...
English phonetic symbol
英语音标发音表-英语48个音标在线读 (jiwake.com) 【英语音标教程】从此学会国际音标|英式音标|BBC音标教程全解_哔哩哔哩_bilibili 元音 单元音 /iː/,/ɪ/ 这两个音不是发音长短的区别, /uː/ /ʊ/ 上面那个就正常读,下面那个她的气大概是往你斜…...
普及组集训--图论最短路径设分层图
P4568 [JLOI2011] 飞行路线 - 洛谷 | 计算机科学教育新生态 可以设置分层图:(伪代码) E(u,v)w;无向图 add(u,v,w),add(v,u,w); for(j1~k){add(ujn,vjn,w);add(vjn,ujn,w);add(ujn-j,vjn-j,0);add(vjn-j,ujn-j,0); } add(ujn-j,vjn-j,0); add(vjn-j,uj…...
SYN6288语音合成模块使用说明(MicroPython、STM32、Arduino)
模块介绍 SYN6288中文语音合成模块是北京宇音天下科技有限公司推出的语音合成模块。该模块通过串口接收主控传来的语音编码后,可自动进行自然流畅的中文语音播报。 注:SYN6288模块无法播报英文单词和句子,只能按字母播报英文 ;而…...
Spring完整知识三(完结)
Spring集成MyBatis 注意 Spring注解形式集成MyBatis时,若SQL语句比较复杂则仍采用映射文件形式书写SQL语句;反之则用注解形式书写SQL语句,具体可详见Spring注解形式 环境准备相同步骤 Step1: 导入相关坐标,完整pom.…...
在软件开发中正确使用MySQL日期时间类型的深度解析
在日常软件开发场景中,时间信息的存储是底层且核心的需求。从金融交易的精确记账时间、用户操作的行为日志,到供应链系统的物流节点时间戳,时间数据的准确性直接决定业务逻辑的可靠性。MySQL作为主流关系型数据库,其日期时间类型的…...
【网络安全产品大调研系列】2. 体验漏洞扫描
前言 2023 年漏洞扫描服务市场规模预计为 3.06(十亿美元)。漏洞扫描服务市场行业预计将从 2024 年的 3.48(十亿美元)增长到 2032 年的 9.54(十亿美元)。预测期内漏洞扫描服务市场 CAGR(增长率&…...
抽象类和接口(全)
一、抽象类 1.概念:如果⼀个类中没有包含⾜够的信息来描绘⼀个具体的对象,这样的类就是抽象类。 像是没有实际⼯作的⽅法,我们可以把它设计成⼀个抽象⽅法,包含抽象⽅法的类我们称为抽象类。 2.语法 在Java中,⼀个类如果被 abs…...
Android写一个捕获全局异常的工具类
项目开发和实际运行过程中难免会遇到异常发生,系统提供了一个可以捕获全局异常的工具Uncaughtexceptionhandler,它是Thread的子类(就是package java.lang;里线程的Thread)。本文将利用它将设备信息、报错信息以及错误的发生时间都…...
Matlab实现任意伪彩色图像可视化显示
Matlab实现任意伪彩色图像可视化显示 1、灰度原始图像2、RGB彩色原始图像 在科研研究中,如何展示好看的实验结果图像非常重要!!! 1、灰度原始图像 灰度图像每个像素点只有一个数值,代表该点的亮度(或…...
CSS3相关知识点
CSS3相关知识点 CSS3私有前缀私有前缀私有前缀存在的意义常见浏览器的私有前缀 CSS3基本语法CSS3 新增长度单位CSS3 新增颜色设置方式CSS3 新增选择器CSS3 新增盒模型相关属性box-sizing 怪异盒模型resize调整盒子大小box-shadow 盒子阴影opacity 不透明度 CSS3 新增背景属性ba…...
无头浏览器技术:Python爬虫如何精准模拟搜索点击
1. 无头浏览器技术概述 1.1 什么是无头浏览器? 无头浏览器是一种没有图形用户界面(GUI)的浏览器,它通过程序控制浏览器内核(如Chromium、Firefox)执行页面加载、JavaScript渲染、表单提交等操作。由于不渲…...
【Docker 02】Docker 安装
🌈 一、各版本的平台支持情况 ⭐ 1. Server 版本 Server 版本的 Docker 就只有个命令行,没有界面。 Platformx86_64 / amd64arm64 / aarch64arm(32 - bit)s390xCentOs√√Debian√√√Fedora√√Raspbian√RHEL√SLES√Ubuntu√√√√Binaries√√√ …...
SeaweedFS S3 Spring Boot Starter
SeaweedFS S3 Spring Boot Starter 源码特性环境要求快速开始1. 添加依赖2. 配置文件3. 使用方式方式一:注入服务类方式二:使用工具类 API 文档SeaweedFsS3Service 主要方法SeaweedFsS3Util 工具类方法 配置参数运行测试构建项目注意事项集成应用更多项目…...
后端解决跨域问题的三种方案:注解配置 vs 全局配置 vs 过滤器配置(附完整代码详解)
文章目录 一、引言:跨域问题的本质与解决方案分类解决方案分类二、方案一:`WebMvcConfigurer` 全局配置(推荐)1. 核心代码(你提供的 `CorsConfig` 示例)2. 代码详解3. 优点4. 注意事项三、方案二:`CorsFilter` 过滤器配置(传统方式)1. 核心代码(你提供的 `ResourcesC…...
