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

浅谈一些生命周期

vue2生命周期

beforeCreate :实例创建之初

created:组件已经创建完成

beforeMount:组件挂载之前

mounted:组件挂载之后

beforeUpdate:数据发生变化 更新之前

undated:数据发生之后

beforeDestroy :实例销毁前

destroyed :销毁后

activated :keep-alive 组件激活

deativated keep-alive 组件停用

注 触发keep-alive 则不会触发销毁生命周期

vue3生命周期

beforeCreate :实例创建之初

created:组件已经创建完成

beforeMount:组件挂载之前

mounted:组件挂载之后

beforeUpdate:数据发生变化 更新之前

undated:数据发生之后

beforeUnmount:实例销毁前

unmounted:销毁后

uniapp的生命周期

1.应用生命周期

应用生命周期是指应用程序从启动到关闭的整个过程,包括应用程序的启动、前后台切换、退出等。Uniapp提供了以下生命周期钩子函数:

onLaunch:应用程序启动时触发,仅在应用程序第一次启动时触发。
onShow:应用程序进入前台时触发,可以获取到应用程序被打开的方式和场景值。
onHide:应用程序进入后台时触发。
onError:应用程序发生错误时触发,可以用来捕获和处理错误信息。
onUniNViewMessage:监听来自nvue页面的消息。


2.页面生命周期

页面生命周期是指页面从创建到销毁的整个过程,包括页面的创建、显示、隐藏和销毁等。Uniapp提供了以下生命周期钩子函数:

onInit:页面被初始化时触发,可以获取页面参数和数据。
onLoad:页面被加载时触发,可以进行数据初始化和网络请求等操作。
onReady:页面渲染完成时触发,可以进行页面动画和交互等操作。
onShow:页面被展示时触发,可以处理页面的显示效果和动画等操作。
onHide:页面被隐藏时触发,可以处理页面的隐藏效果和动画等操作。
onUnload:页面被销毁时触发,可以进行资源释放和清理等操作。


3.组件生命周期

组件生命周期是指组件从创建到销毁的整个过程,包括组件的创建、更新、销毁等。Uniapp提供了以下生命周期钩子函数:

beforeCreate:组件实例被创建之前触发,此时组件的数据和方法都还没有初始化。
created:组件实例被创建之后触发,此时组件的数据和方法已经初始化。
beforeMount:组件被渲染之前触发,此时组件还没有被渲染到页面上。
mounted:组件被渲染之后触发,此时组件已经被渲染到页面上。
beforeUpdate:组件数据更新之前触发,此时组件的数据还没有被更新。
updated:组件数据更新之后触发,此时组件的数据已经被更新。
beforeDestroy:组件实例被销毁之前触发,此时组件的数据和方法还可以访问。
destroyed:组件实例被销毁之后触发,此时组件的数据和方法已经无法访问。
 

小程序生命周期

(1)应用生命周期

onLanch: 小程序初始化完成时触发,全局只触发一次

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

onHide: 小程序从前台进入后台时触发(如底部tab栏切换到其他页面)

onEerror:小程序发生错误或者API调用报错时触发

onPageNotFound: 小程序要打开的页面不存在时触发

onUnhandleRejection:小程序有未处理的Promise拒绝时触发

onThemeChange:系统切换主题时触发

(2)页面生命周期

onLoad: 监听页面加载(只会调用一次,可获取当前页面路径的参数,相当于view中的created)

onShow: 监听页面显示(发送请求获取数据)

onReady:监听页面初次渲染完成(获取页面元素,相当于view中的mounted)

onHide:监听页面隐藏(如底部tab栏切换到其他页面或小程序切入后台等触发)

onUnload:监听页面卸载(如redirectTo或navigateBack到其他页面时触发

(3)组件生命周期

created:监听页面加载

attached:监听页面显示(这个生命周期用的多,绝大多数初始化工作可以在这里进行)

ready:监听页面初次渲染完成

moved:监听页面隐藏

detached:监听页面卸载

error:每当组件方法抛出错误时间

相关文章:

浅谈一些生命周期

vue2生命周期 beforeCreate :实例创建之初 created:组件已经创建完成 beforeMount:组件挂载之前 mounted:组件挂载之后 beforeUpdate:数据发生变化 更新之前 undated:数据发生之后 beforeDestroy :实…...

JavaScript基础(25)_dom查询练习(二)

<!DOCTYPE html> <html lang"zh"> <head><meta charset"UTF-8"><title>dom查询练习二</title><link rel"stylesheet" href"../browser_default_style/reset.css"><style>form {margi…...

【React系列】React生命周期、setState深入理解、 shouldComponentUpdate和PureComponent性能优化、脚手架

本文来自#React系列教程&#xff1a;https://mp.weixin.qq.com/mp/appmsgalbum?__bizMzg5MDAzNzkwNA&actiongetalbum&album_id1566025152667107329) 一. 生命周期 1.1. 认识生命周期 很多的事物都有从创建到销毁的整个过程&#xff0c;这个过程称之为是生命周期&…...

一文初步了解slam技术

本文初步介绍slam技术&#xff0c;主要是slam技术的概述&#xff0c;涉及技术原理、应用场景、分类、以及各自优缺点&#xff0c;和slam技术的未来展望。 &#x1f3ac;个人简介&#xff1a;一个全栈工程师的升级之路&#xff01; &#x1f4cb;个人专栏&#xff1a;slam精进之…...

滑动窗口协议仿真(2024)

1.题目描述 滑动窗口协议以基于分组的数据传输协议为特征&#xff0c;该协议适用于在数据链路层以及传输层中对按 顺序传送分组的可靠性要求较高的环境。在长管道传输过程&#xff08;特别是无线环境&#xff09;中&#xff0c;相应的滑动窗口 协议可实现高效的重传恢复。附录 …...

uniapp上传文件时用到的api是什么?格式是什么?

在UniApp中&#xff0c;你可以使用uni.uploadFile()方法来上传文件。这是一个异步方法&#xff0c;用于将本地资源上传到服务器。 该方法的基本格式如下&#xff1a; uni.uploadFile({url: 上传接口地址,filePath: 要上传的文件路径,name: 后端接收的文件参数名,formData: {/…...

Java面试——框架篇

1、Spring框架中的单例bean是线程安全的吗&#xff1f; 所谓单例就是所有的请求都用一个对象来处理&#xff0c;而多例则指每个请求用一个新的对象来处理。 结论&#xff1a;线程不安全。 Spring框架中有一个Scope注解&#xff0c;默认的值就是singleton&#xff0c;单例的。一…...

GO语言笔记1-安装与hello world

SDK开发工具包下载 Go语言官网地址&#xff1a;golang.org&#xff0c;无法访问Golang中文社区&#xff1a;首页 - Go语言中文网 - Golang中文社区下载地址&#xff1a;Go下载 - Go语言中文网 - Golang中文社区 尽量去下载稳定版本&#xff0c;根据使用系统下载压缩包格式的安装…...

指针传参误区

C语言中指针作为形参传递时&#xff0c;func&#xff08;*a, *b&#xff09; 这种形式的话&#xff0c;是无法通过简单的 ab来修改的&#xff0c;在函数体内a的地址确实被修改成b的地址了&#xff0c;但是当函数执行结束时&#xff0c;a的地址会重新回到原本的地址里面&#xf…...

力扣-42.接雨水

题目&#xff1a; 给定 n 个非负整数表示每个宽度为 1 的柱子的高度图&#xff0c;计算按此排列的柱子&#xff0c;下雨之后能接多少雨水。 示例 1&#xff1a; 输入&#xff1a;height [0,1,0,2,1,0,1,3,2,1,2,1] 输出&#xff1a;6 解释&#xff1a;上面是由数组[0,1,0,2…...

LeetCode-移动零(283)

题目描述&#xff1a; 给定一个数组 nums&#xff0c;编写一个函数将所有 0 移动到数组的末尾&#xff0c;同时保持非零元素的相对顺序。 请注意 &#xff0c;必须在不复制数组的情况下原地对数组进行操作。 思路&#xff1a; 这里的思路跟以前做过的去重复数字的思路有点像&…...

文件系统与日志分析

一&#xff0c;文件系统 &#xff08;一&#xff09;inode 和block概述 1&#xff0c;文件数据包括元信息与实际数据 2&#xff0c;文件存储在硬盘上&#xff0c;硬盘最小存储单位是“扇区”&#xff0c;每个扇区存储512字节 3&#xff0c;block (块) 连续的八个扇区组成一…...

labview 与三菱FX 小型PLC通信(OPC)

NI OPC服务器与三菱FX3U PLC通讯方法 一、新建通道名称为&#xff1a;MIT 二、选择三菱FX系列 三、确认端口号相关的参数&#xff08;COM端&#xff1a;7.波特率&#xff1a;9600&#xff0c;数据位&#xff1a;7&#xff0c;校验&#xff1a;奇校验&#xff0c;停止位&#xf…...

掌握Linux网络配置:价格亲民,操作简便!

前言 在Linux系统中&#xff0c;网络配置是实现连接、通信和安全的重要一环。无论你是初学者还是有经验的用户&#xff0c;掌握网络配置命令能帮助你轻松管理网络接口、设置IP地址以及查看连接状态。以下是一些关键命令和示例&#xff0c;让你快速掌握网络操作的精髓&#xff…...

郑州大学算法设计与分析实验2

判断题 1 #include<bits/stdc.h> using namespace std;const int N 50; int f[N], n;int main() { // freopen("1.in", "r", stdin);ios::sync_with_stdio(false);cin.tie(0);cout.tie(0);cin >> n;f[1] 1; f[2] 1;for(int i 3; i &l…...

【CMake】1. VSCode 开发环境安装与运行

CMake 示例工程代码 https://github.com/LABELNET/cmake-simple 插件 使用 VSCode 开发C项目&#xff0c;安装 CMake 插件 CMakeCMake ToolsCMake Language Support &#xff08;建议&#xff0c;语法提示) 1. 配置 CMake Language Support , Windows 配置 donet 环境 这…...

使用vue3+<script setup>+element-plus中el-table前端切片完成分页效果

<template><div><el-table :data"visibleData" :row-key"row > row.id"><el-table-column prop"name" label"姓名"></el-table-column><el-table-column prop"age" label"年龄&qu…...

vue 中 computed 和 watch 的区别

在Vue中&#xff0c;computed和watch都是用于监听数据的变化&#xff0c;并且根据变化做出相应的反应。 computed是一个计算属性&#xff0c;它会根据依赖的数据的变化自动计算得出一个新的值&#xff0c;并且具有缓存的特性。当依赖的数据发生变化时&#xff0c;computed属性…...

gephi——graphviz插件设置

gephi_graphviz插件设置 以下是我总结出来的一点经验 1. 安装graphviz软件&#xff0c;请见作者其他博客 2. 安装gephi 插件&#xff0c;并激活 3. 运行graphviz布局&#xff0c;会遇到找不到dot问题 问题描述&#xff1a;Graphviz process error X There was an error launc…...

wireshark抓包分析HTTP协议,HTTP协议执行流程,

「作者主页」&#xff1a;士别三日wyx 「作者简介」&#xff1a;CSDN top100、阿里云博客专家、华为云享专家、网络安全领域优质创作者 「推荐专栏」&#xff1a;对网络安全感兴趣的小伙伴可以关注专栏《网络安全入门到精通》 使用WireShark工具抓取「HTTP协议」的数据包&#…...

FanControl终极指南:如何在Windows上实现专业级风扇控制与噪音优化[特殊字符]

FanControl终极指南&#xff1a;如何在Windows上实现专业级风扇控制与噪音优化&#x1f525; 【免费下载链接】FanControl.Releases This is the release repository for Fan Control, a highly customizable fan controlling software for Windows. 项目地址: https://gitco…...

实战指南:基于快马平台快速开发树莓派远程视频监控系统

最近在折腾树莓派&#xff0c;想做个简单的远程监控系统。之前总卡在环境配置和代码调试上&#xff0c;后来发现用InsCode(快马)平台可以快速生成可运行的项目骨架&#xff0c;省去了不少麻烦。这里分享下我的实现过程&#xff1a; 硬件准备 树莓派4B搭配官方摄像头模块是最基础…...

Ling-1T万亿参数模型:高效推理新体验

Ling-1T万亿参数模型&#xff1a;高效推理新体验 【免费下载链接】Ling-1T-FP8 项目地址: https://ai.gitcode.com/hf_mirrors/inclusionAI/Ling-1T-FP8 导语&#xff1a;近日&#xff0c;inclusionAI团队正式发布了Ling系列2.0版本的旗舰模型——Ling-1T-FP8&#xff…...

Vue 3 Fragments:打破枷锁的组件化革命

Vue 3 Fragments&#xff1a;打破枷锁的组件化革命 在前端框架的演进史上&#xff0c;每一次对底层限制的突破&#xff0c;往往都伴随着开发体验的质的飞跃。Vue 3 中引入的 Fragments&#xff08;片段&#xff09; 特性&#xff0c;正是这样一场迟来的“解绑”革命。它彻底粉碎…...

大语言模型应用落地:从RAG到工作流,IT企业智能转型全攻略!

引言检索增强生成&#xff08;RAG&#xff09;微调&#xff08;Fine-Tuning&#xff09;智能体&#xff08;Agents&#xff09;工作流与流程编排&#xff08;Workflow&#xff09;企业落地策略与阶段规划落地难点与最佳实践建议结语引言大语言模型&#xff08;LLM&#xff09;技…...

PX4飞控系统深度解析:从模块化架构到自主飞行核心技术揭秘

PX4飞控系统深度解析&#xff1a;从模块化架构到自主飞行核心技术揭秘 【免费下载链接】PX4-Autopilot PX4 Autopilot Software 项目地址: https://gitcode.com/gh_mirrors/px/PX4-Autopilot 你是否曾好奇&#xff0c;一个开源飞控系统如何支撑从微型无人机到工业级无人…...

Qwen3-14B入门到精通:从环境搭建到多轮工具调用防死循环实战

Qwen3-14B入门到精通&#xff1a;从环境搭建到多轮工具调用防死循环实战 1. 为什么选择Qwen3-14B 在当今企业AI应用场景中&#xff0c;我们常常面临一个两难选择&#xff1a;要么使用功能有限的小模型&#xff0c;要么部署资源消耗巨大的千亿参数模型。Qwen3-14B恰好提供了一…...

HunyuanVideo-Foley应用场景:播客自动化剪辑、TTS语音情感增强音效

HunyuanVideo-Foley应用场景&#xff1a;播客自动化剪辑与TTS语音情感增强音效 1. 镜像概述与核心能力 HunyuanVideo-Foley私有部署镜像是一款专为音视频生成任务优化的AI工具包&#xff0c;特别针对RTX 4090D 24GB显存显卡进行了深度优化。这个开箱即用的解决方案将视频生成…...

基于springboot美食分享平台设计与开发(源码+精品论文+答辩PPT等资料)

博主介绍&#xff1a;CSDN毕设辅导第一人、靠谱第一人、全网粉丝50W,csdn特邀作者、博客专家、腾讯云社区合作讲师、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交…...

3步精通FanControl:从噪音难题到智能散热的技术蜕变

3步精通FanControl&#xff1a;从噪音难题到智能散热的技术蜕变 【免费下载链接】FanControl.Releases This is the release repository for Fan Control, a highly customizable fan controlling software for Windows. 项目地址: https://gitcode.com/GitHub_Trending/fa/F…...