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

uni-app的生命周期(应用,页面生命周期)

1. uni-app的生命周期(应用,页面生命周期)

1.1. 应用生命周期

1.1.1. 定义在app.vue中

生命周期函数名说明
onLaunch当uni-app 初始化完成时触发(全局只触发一次)
onShow当 uni-app 启动,或从后台进入前台显示(多次触发)
onHide当 uni-app 从前台进入后台(多次触发)
onUniNViewMessage对 nvue 页面发送的数据进行监听,可参考 nvue 向 vue 通讯(出现代码异常,报错时触发)

注意:

  (1)应用生命周期仅可在App.vue中监听,在其它页面监听无效。
  (2)onlaunch里进行页面跳转,如遇白屏报错,请参考 https://ask.dcloud.net.cn/article/35942

1.2. 页面生命周期

1.2.1. 定义在各个页面中

生命周期函数名说明e
onLoad监听页面加载,其参数为上个页面传递的数据,参数类型为Object(用于页面传参)(单次触发)
onShow监听页面显示。页面每次出现在屏幕上都触发,包括从下级页面点返回露出当前页面(多次触发)
onReady监听页面初次渲染完成。注意如果渲染速度快,会在页面进入动画完成前触发(单次触发)
onHide监听页面隐藏(多次触发)
onUnload监听页面卸载
onResize监听窗口尺寸变化
onPullDownRefresh监听用户下拉动作,一般用于下拉刷新
onPageScroll监听原生标题栏按钮点击事件,参数为Object
onReachBottom页面滚动到底部的事件(不是scroll-view滚到底),常用于上拉加载下一页数据。如使用scroll-view导致页面级没有滚动,则触底事件不会被触发

注意:
  (1)H5端onBackPress只能监听页面导航栏的返回按钮的点击事件,不能监听浏览器返回以及手机的返回
  (2)页面生命周期仅在page页面有效,而单独封装的组件中【页面周期无效】,但是Vue的生命周期依然有效 【Vue的生命周期在任何地方都是有效的】
  (3)推荐使用uni-app里面的onReady 代替 vue 里面的 mounted
  (4)推荐使用uni-app里面的onLoad 代替 vue 里面的 created

1.2.2. onPageScroll 参数说明:

  属性:scrollTop 类型:Number 说明 : 页面在垂直方向已滚动的距离(单位px)

1.2.3. 生命周期函数执行顺序:

  页面加载过程: 加载=》显示=》加载完成=》页面隐藏=》页面卸载 触发页面生命周期: onLoad:监听页面加载 =》
onShow:监听页面显示 =》 onReady:监听页面初次渲染完成 =》 onHide:监听页面隐藏 =》
onUnload:监听页面卸载

1.2.4. Page页面生命周期函数执行顺序

  beforeCreate => onLoad => onShow => created => beforeMount => onReady => mounted

1.2.5. 刷新数据后

  beforeUpdate => updated

相关文章:

uni-app的生命周期(应用,页面生命周期)

1. uni-app的生命周期(应用,页面生命周期) 1.1. 应用生命周期 1.1.1. 定义在app.vue中 生命周期函数名说明onLaunch当uni-app 初始化完成时触发(全局只触发一次)onShow当 uni-app 启动,或从后台进入前台…...

响应式企业网站建站系统源码 模版丰富+一站式建站 全开源可二次开发 带源码包+搭建部署教程

系统概述 在数字化转型的浪潮中,企业官网作为品牌展示、产品推广及客户服务的重要窗口,其建设质量直接影响着企业的线上形象与市场竞争力。响应式企业网站建站系统源码的出现,为企业提供了一种高效、灵活且成本可控的建站解决方案。 代码示…...

如何解除内存卡的写保护并格式化为exFAT文件系统

最近有客户提问内存卡提示写保护,且无法格式化为exFAT格式的问题,可能是由于多种原因引起的。以下是一些可能的解决方法: 1. 检查物理写保护开关 一些SD卡和MicroSD卡适配器上有一个小的物理开关,可以启用或禁用写保护。确保这个…...

【 EI会议 | 西南大学主办 | 往届均已实现检索】第三届神经形态计算国际会议(ICNC 2024)

第三届神经形态计算国际会议(ICNC 2024) 2024 3rd International Conference on Neuromorphic Computing (ICNC 2024) 一、重要信息 大会官网:www.ic-nc.org(点击投稿/参会/了解会议详情) 会议时间:2024年12月13-15…...

利用python爬虫采集苹果公司各产品销售收入统计报告

数据为2013年到2022年苹果公司各产品(iPhone、iPad、Mac等)及服务的销售收入。iPhone是苹果公司销售收入最高的产品。 数据统计单位为:亿美元 。 数据说明: 数据整理自苹果公司历年10-K文件,每年10-K文件可能对之前年…...

ethercat igh可能出现的两个bug

1. 插入网线直接就进入op状态,这可能是因为 从站支持eoe协议 igh对eoe协议支持的从站默认使其直接进入op状态,可以修改igh源码编译选项,不启动eoe协议 可以参考: igh编译选项 igh一些EoE协议说明 Automatic Configuration&#…...

计算机网络知识点(三)

目录 一、简述TCP连接和关闭的状态转移 二、简述TCP慢启动 三、简述TCP如何保证有序 四、简述TCP常见的拥塞控制算法 五、简述TCP超时重传 一、简述TCP连接和关闭的状态转移 状态转移图 图中上半部分是TCP的三次握手过程的状态变迁,下半部分是TCP四次挥手过程的…...

关于认证协议

本地用户认证 本地认证的意思就是,我们的电脑上存储着自己的账号密码,无论电脑是否联网,只要能开机,就可以输入账号密码登录到电脑中,工作组就是采用本地认证 本地认证流程 winlogon.exe -> 接收用户输入 -> …...

C#操作MySQL从入门到精通(20)——更新数据

前言: 谈到数据库,大家最容易脱口而出的就是增删改查,本文所说的更新数据就是增删改查的改,改变数据的意思。 本文测试使用的数据库如下: 1、更新一列 所谓更新一列的意思就是只更改一列数据,并且通常要使用where条件,因为不加这个条件的话会导致将所有行的数据进行…...

NVMe全闪存储系统性能测试及产品功能与应用场景

今天我们继续对全闪存储系统GS 5024UE的评测,重点关注GS 5024UE的性能测试数据,以及产品所具备的功能、应用场景。通过Windows IOmeter测试软件,来测试GS 5024UE设备的性能,在机器上配上24颗 NVMe 3.84TB硬盘, 16条32Gb FC数据&am…...

C#面:C#面向对象的思想主要包括什么?

C#面向对象的思想主要包括以下几个方面: 封装(Encapsulation):封装是将数据和操作数据的方法封装在一起,形成一个类。通过封装,可以隐藏类的内部实现细节,只暴露必要的接口给外部使用。这样可以…...

海南云亿商务咨询有限公司正规吗?怎么样?

在当下数字化浪潮汹涌的时代,抖音电商作为新兴的营销渠道,正以其独特的魅力和巨大的市场潜力,吸引着越来越多的企业和品牌投身其中。作为专注抖音电商服务的佼佼者,海南云亿商务咨询有限公司凭借专业的团队、丰富的经验和前瞻的战…...

【数据结构】排序(上)

个人主页~ 堆排序看这篇~ 还有这篇~ 排序 一、排序的概念及应用1、概念2、常见的排序算法 二、常见排序的实现1、直接插入排序(1)基本思想(2)代码实现(3)时间复杂度(4)空间复杂度 2…...

vue3+el-plus对eleplus对el-table表格进行拖拽(使用sortablejs进行列拖拽和行拖拽):

如有对表格拖拽进行限制某列或某行不进行拖拽的需求,请点击: vue3ele-plussortableJs对el-table使用sortableJs插件对表格拖拽时限定某列或某行不允许拖拽-CSDN博客 如果你已实现拖拽需求,但拖拽后发现表头并未改变的话,请点击&…...

Nginx如何隐藏版本号

1 找到nginx.conf配置文件进行修改 http{...server{listen 80 default_server;listen [::]:80 default_server;server_name _;root /usr/share/nginx/html;server_tokens off; #添加这一项就可以了location / {}error_page 404 /404.html;location /40…...

用C#(WinForm)开发触摸屏,体验感满满

用C#(WinForm)开发触摸屏,体验感满满...

LaneKeepingEnv(自动驾驶仿真)

LaneKeepingEnv环境的工作原理可以归纳如下: 初始化阶段: 环境在创建时,会调用__init__方法进行初始化。初始化过程中,会设置一些关键的属性,如lane(当前车道)、lanes(所有车道的列…...

C++类与对象(拷贝与类的内存管理)

感谢大佬的光临各位,希望和大家一起进步,望得到你的三连,互三支持,一起进步 个人主页:LaNzikinh-CSDN博客 文章目录 前言一.对象的动态建立和释放二.多个对象的构造和析构三.深拷贝与浅拷贝四.C类的内存管理总结 前言 …...

C语言----字符函数和字符串函数

在编程的过程中,我们要经常处理字符和字符串,为了方便操作字符和字符串,c语言标准库中提供的一系列库函数,接下来我们就开始学习与认识他们 1.字符分类函数 c语言中有一系列的函数是专门做字符分类的,也就是一个字符…...

神经网络 torch.nn---Convolution Layers

torch.nn — PyTorch 2.3 documentation torch.nn - PyTorch中文文档 (pytorch-cn.readthedocs.io) torch.nn和torch.nn.functional的区别 torch.nn是对torch.nn.functional的一个封装,让使用torch.nn.functional里面的包的时候更加方便 torch.nn包含了torch.nn.…...

wordpress后台更新后 前端没变化的解决方法

使用siteground主机的wordpress网站,会出现更新了网站内容和修改了php模板文件、js文件、css文件、图片文件后,网站没有变化的情况。 不熟悉siteground主机的新手,遇到这个问题,就很抓狂,明明是哪都没操作错误&#x…...

7.4.分块查找

一.分块查找的算法思想: 1.实例: 以上述图片的顺序表为例, 该顺序表的数据元素从整体来看是乱序的,但如果把这些数据元素分成一块一块的小区间, 第一个区间[0,1]索引上的数据元素都是小于等于10的, 第二…...

Spring是如何解决Bean的循环依赖:三级缓存机制

1、什么是 Bean 的循环依赖 在 Spring框架中,Bean 的循环依赖是指多个 Bean 之间‌互相持有对方引用‌,形成闭环依赖关系的现象。 多个 Bean 的依赖关系构成环形链路,例如: 双向依赖:Bean A 依赖 Bean B,同时 Bean B 也依赖 Bean A(A↔B)。链条循环: Bean A → Bean…...

使用LangGraph和LangSmith构建多智能体人工智能系统

现在,通过组合几个较小的子智能体来创建一个强大的人工智能智能体正成为一种趋势。但这也带来了一些挑战,比如减少幻觉、管理对话流程、在测试期间留意智能体的工作方式、允许人工介入以及评估其性能。你需要进行大量的反复试验。 在这篇博客〔原作者&a…...

云原生周刊:k0s 成为 CNCF 沙箱项目

开源项目推荐 HAMi HAMi(原名 k8s‑vGPU‑scheduler)是一款 CNCF Sandbox 级别的开源 K8s 中间件,通过虚拟化 GPU/NPU 等异构设备并支持内存、计算核心时间片隔离及共享调度,为容器提供统一接口,实现细粒度资源配额…...

【安全篇】金刚不坏之身:整合 Spring Security + JWT 实现无状态认证与授权

摘要 本文是《Spring Boot 实战派》系列的第四篇。我们将直面所有 Web 应用都无法回避的核心问题:安全。文章将详细阐述认证(Authentication) 与授权(Authorization的核心概念,对比传统 Session-Cookie 与现代 JWT(JS…...

大数据治理的常见方式

大数据治理的常见方式 大数据治理是确保数据质量、安全性和可用性的系统性方法,以下是几种常见的治理方式: 1. 数据质量管理 核心方法: 数据校验:建立数据校验规则(格式、范围、一致性等)数据清洗&…...

大数据驱动企业决策智能化的路径与实践

📝个人主页🌹:慌ZHANG-CSDN博客 🌹🌹期待您的关注 🌹🌹 一、引言:数据驱动的企业竞争力重构 在这个瞬息万变的商业时代,“快者胜”的竞争逻辑愈发明显。企业如何在复杂环…...

Linux中INADDR_ANY详解

在Linux网络编程中&#xff0c;INADDR_ANY 是一个特殊的IPv4地址常量&#xff08;定义在 <netinet/in.h> 头文件中&#xff09;&#xff0c;用于表示绑定到所有可用网络接口的地址。它是服务器程序中的常见用法&#xff0c;允许套接字监听所有本地IP地址上的连接请求。 关…...

华为OD机考- 简单的自动曝光/平均像素

import java.util.Arrays; import java.util.Scanner;public class DemoTest4 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseint[] arr Array…...