面试题:Vue生命周期

Vue生命周期

  • 一、是什么
  • 二、Vue2生命周期
  • 三、Vue2生命周期整体流程
  • 四、Vue3生命周期

一、是什么

Vue中的实例从创建到销毁的过程就是生命周期,即指从创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、卸载等一系列过程

二、Vue2生命周期

Vue2生命周期总共可以分为8个阶段:创建前后,载入前后,更新前后,销毁前销毁后,以及一些特殊场景的生命周期
在这里插入图片描述

三、Vue2生命周期整体流程

在这里插入图片描述

  • 组件实例创建之前beforeCreate,初始化vue实例
  • 组件实例已经创建created,可调用methods中的方法,访问和修改data数据
  • 组件挂载到实例之前beforeMount,这个阶段只有虚拟dom
  • 组件挂载到实例之后mounted,这个阶段才有真实dom
  • 组件数据更新之前beforeUpdate,这个阶段的数据是被渲染在模板上的初始数据
  • 组件数据更新之后updated,这个阶段的数据是更新后的数据
  • 组件实例销毁之前beforeDestroy,vue实例被销毁之前
  • 组件实例销毁之后destroyed,vue实例被完全销毁

四、Vue3生命周期

  1. 在 Vue 3 中,生命周期钩子的名称和行为有一些变化

    • 组件实例创建阶段(beforeCreate与created)用setup代替
    • beforeMount -> onBeforeMount
    • mounted -> onMounted
    • beforeUpdate -> onBeforeUpdate
    • updated -> onUpdated
    • beforeDestroy -> onBeforeUnmount
    • destroyed -> onUnmounted
  2. 新增的生命周期钩子

    • onRenderTracked:当渲染触发的依赖追踪时调用,可以用来调试和性能分析
    • onRenderTriggered:当渲染触发的依赖更改时调用,可以用来调试和性能分析

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/1467.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

元宇宙VR展会突破传统会展局限,打造会展新生态与商业新机遇

一、身临其境感受会展新境界 元宇宙VR展会利用虚拟现实技术,为参会用户打造了一个高度还原的虚拟会展空间。用户只需使用手机、平板、电脑等设备,即可瞬间穿越至展会现场,仿佛置身于真实的会展环境中。 在这里,用户可以自由浏览…

[每周一更]-(第121期):模拟面试|微服务架构面试思路解析

这一系列针对Go面试题整理,仅供参考 文章目录 00|综合服务治理方案:怎么保证微服务应用的高可用?1. **什么是微服务架构?**2. **怎么保证微服务架构的高可用?**3. **怎么判定服务是否已经健康?**4. **如果服务不健康该怎么办?**5. **怎么判定服务已经从不健康状态恢复过…

【产品经理】工业互联网企业上市之路

树根互联2022年6月2日提交招股书之后,因财务资料超过六个月有效期加三个月延长期,2022年9月30日上市审核中止;2022年12月26日树根互联更新了2022年半年度财务资料,又九个月过去了,其上市进程将面临再一次中止。 处于上…

AI图像相似性搜索对比:VIT, CLIP, DINO-v2, BLIP-2

图像相似性搜索的核心在于一个简单的想法:图像可以表示为高维空间中的向量。当两个图像相似时,它们的向量应该在这个空间中占据相似的位置。我们可以通过测量角度(或余弦相似度)来确定这些向量的相似程度。如果角度小,…

AI风险及数据合规问题

一、数据来源合规问题 1、请说明发行人采集数据时是否获得了相关信息主体及用户的合法授权,获取用户数据的手段及方式是否合法合规; 2、请说明发行人获取用户数据及标签的过程及方法,是否对用户有明示提示,用户授权在法律上是否完备&#xff…

yoloV5实战笔记—环境搭建(一)

一、安装miniconda 从清华源进行下载 https://mirrors.tuna.tsinghua.edu.cn/ 具体命令参考,注意修改pip国内镜像地址 https://mirrors.tuna.tsinghua.edu.cn/help/AOSP/ 创建环境,指定python版本 conda create -n demo python3.9激活环境 conda acti…

Docker:存储原理

Docker:存储原理 镜像联合文件系统overlay镜像存储结构容器存储结构 存储卷绑定挂载存储卷结构 镜像 联合文件系统 联合文件系统Union File System是一种分层,轻量且高效的文件系统。其将整个文件系统分为多个层,层与层之间进行覆盖&#x…

【源码+文档】基于SpringBoot的养老院管理系统

作者简介:✌CSDN新星计划导师、Java领域优质创作者、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交流。✌ 主要内容:🌟Java项目、Python项目、前端项目、PHP、ASP.NET、人工智能…

LVGL UI设计神器助你高效开发嵌入式UI应用——v0.16.0发布

文章目录 Preface一、What is Anyui?二、Features of v0.16.0 releaseSum up Preface As coming of Internet of Things, the “screen reading” era predicted by Kevin Kelly has also arrived. Besides products like mobile phones and tablets which are PC-…

JavaFx -- chapter06(UDPSocket)

chapter06(UDPSocket) UPD的特点 UDP有独立的套接字(IP PORT),与TCP使用相同端口号不会冲突。UDP在使用前不需要进行连接,没有流的概念。UDP通信类似于邮件通信:不需要实时连接,只需要目的地址。UDP通信…

爬虫学习2

数据解析 正则表达式 量词: import re#searcch只会匹配到第一次匹配的内容#result re.search(r"\d","今年32")#print(result.group()) #result re.findall(r"\d","我是一个abcdeafg") #print(result)#search只会匹配到第…

radio astronomy 2

地球上的电离层会被太阳风影响。

服务器作业(2)

架设一台NFS服务器,并按照以下要求配置 关闭防火墙 [rootlocalhost ~]# systemctl stop firewalld [rootlocalhost ~]# setenforce 0 配置文件设置: [rootlocalhost ~]# vim /etc/exports 1、开放/nfs/shared目录,供所有用户查询资料 共享…

基于MATLAB多参数结合火焰识别系统

一、课题介绍 本设计为基于MATLAB的火焰烟雾火灾检测系统。传统的采用颜色的方法,误识别大,局限性强。结合火焰是实时动态跳跃的,采用面积增长率,角点和圆形度三个维度相结合的方式判断是否有火焰。该设计测试对象为视频&#xf…

云轴科技ZStack在CID大会上分享VF网卡热迁移技术

近日,2024中国云计算基础架构开发者大会(以下简称CID大会)在北京举行。此次大会集中展示了云计算基础架构技术领域最前沿的科创成果,汇聚众多的技术专家和行业先锋,共同探讨云计算基础设施的最新发展和未来趋势。云轴科…

阿里云 K8S ACK服务 创建使用教程

目录 1.1 阿里云容器服务ACK介绍和创建 1.1.1 什么是容器服务Kubernetes版? 1.1.2 创建专有版Kubernetes集群 1.1.3 访问专有版Kubernetes集群 1.1.4 在专有版ACK集群创建资源并访问 通过百度网盘分享的文件:第12章-阿里云托管k8s集群ACK创建和使用 链接&…

H5测试点总结

一、概述 1.1 什么是H5 H5 即 HTML5,是最新的 Web 端开发语言版本,现如今,大多数手机 APP 页面会用 H5 实现,包括 PC Web 站点也会用它开发实现。所以 Web 的通用测试点和方法基本都可以适用于它。H5其实就是:移动端…

TapData 发布官方性能测试报告,针对各流行数据源,在多项指标中表现拔群

近日,TapData 官方发布了最新的性能测试报告,该报告详细展示了 TapData v3.5.13 在各种数据源下的性能表现,包括全量同步、增量同步、读写延迟等关键性能指标。 随着企业对实时数据集成和处理能力需求的提升,TapData 凭借其高效、…

小红书发布IP与实际不一样?揭秘背后的原因与应对策略

在小红书这个充满活力的社交平台上,用户们经常分享着各自的生活点滴、购物心得、美食体验等丰富内容。然而,有时你可能会发现,小红书上显示的IP地址与你的实际所在地并不一致,这不禁让人心性疑惑。那么,小红书发布IP与…

Java8 新特性 —— Stream API 详解

本文涉及到的知识点有Lambda表达式以及函数式接口,有不了解的小伙伴可以先学习上一篇文章: Java8 新特性 —— Lambda 表达式、函数接口以及方法引用详解 文章目录 引言Stream API 的使用1、创建 Stream2、中间操作(1)筛选与切片…