每日一VUE——组件的生命周期

文章目录

  • VUE组件的生命周期
    • 生命周期钩子函数
    • 实例创建
    • Teleport

VUE组件的生命周期

  • 组件生命周期

组件从创建到挂载、更新、到销毁的一系列过程被称为组件的生命周期。

  • 生命周期函数

在组件的各个生命周期节点执行的函数,为生命周期钩子函数。

生命周期钩子函数

组件的生命周期可以分为4个阶段:创建、挂载、更新、销毁。

所以生命周期钩子函数也分为4组:

  1. 创建阶段

    1. 对组件事件和生命周期钩子函数进行初始化,之后立即调用beforeCreate函数
    2. 对组件选项的配置进行初始化,之后立即调用created函数
  2. 挂载阶段

    1. 基于数据和模板,在内存生成虚拟DOM结构,之后立即调用beforeMount函数

    2. 用虚拟DOM结构替换挂载点内的元素,之后立即调用mounted函数

  3. 更新阶段

    1. 根据数据变化,重新更新虚拟DOM结构,之后立即执行beforeUpdate函数

    2. 将虚拟DOM结构更新部分,重新渲染到页面中,之后立即调用update函数

  4. 销毁阶段

    1. 组件实例在被销毁之前,VUE会自动调用beforeUnmount函数,此时组件实例依然保持全部功能

    2. 在组件实例在被销毁之后,VUE会立即调用Unmounted函数

在这里插入图片描述

实例创建

  1. 对组件事件和生命周期钩子函数进行初始化,之后立即调用beforeCreate函数
  2. 对组件选项的配置进行初始化,之后立即调用created函数

Teleport

Teleport内置组件的作用是将组件模板结构的部分内容“传送”给该组件渲染区域之外的地方,一般在创建模态框、弹出窗口或其他覆盖在页面上的元素时使用。

若有错误与不足请指出,关注DPT一起进步吧!!!

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

RT-thread信号量与互斥量

1,信号量 信号量是一种轻型的用于解决线程间同步问题的内核对象,线程可以获取或释放它,从而达到同步或互斥的目的。理解资源计数适合于线程间工作处理速度不匹配的场合;信号量在大于0时才能获取,在中断、线程中均可释放信号量。 为了体现使用信号量来达到线程间的同步,…

【STM32】西南交大嵌入式系统设计实验:环境配置

把走过的坑记录一下,希望后来人避坑 No ST-Link device detected.问题解决 如果跟着指导书出现这个问题: 直接跳过这一步不用再更新固件,后面直接创建项目写程序就行了。 在keil里配置成用DAP_link即可。 详细的可以看这篇文章&#xff1a…

NumPy基础及取值操作

文章目录 第1关:ndarray对象第2关:形状操作第3关:基础操作第4关:随机数生成第5关:索引与切片 第1关:ndarray对象 编程要求 根据提示,在右侧编辑器Begin-End中填充代码,根据测试用例…

Oracle 数据库 count的优化-避免全表扫描

Oracle 数据库 count的优化-避免全表扫描 select count(*) from t1; 这句话比较简单,但很有玄机!对这句话运行的理解,反映了你对数据库的理解深度! 建立实验的大表他t1 SQL> conn scott/tiger 已连接。 SQL> drop table …

Fiddler工具的操作和功能时-----定位到步骤图(助力抓包)

前言: 继续上一篇,已经对fiddler的安装、配置和代理的问题进行了讲解: Fiddle配置代理,保手机模拟器访问外部网络-CSDN博客 本章,讲对一些fiddler的操作进行一系列讲解!Fiddler作为一款网络调试工具&…

可视化大屏的应用(13):3D建模运用到机房运维中

可视化大屏在机房运维中发挥着重要的作用,主要体现在以下几个方面: 实时监控 通过可视化大屏,可以实时监控机房的各项指标和状态,如服务器的运行状态、网络流量、机房温度等。运维人员可以通过大屏快速获取关键信息,…

LazyVim开发vue2

neovim 0.5刚出来的时代,那时刚有lua插件我很狂热。每天沉迷于打造自己的IDE之中。写过一堆相关的博客,也录过一些视频教程。后来发现neovim的接口和插件更新的很快,导致配置文件要不定期的修改,才能保证新版本的插件的适配。我也…

程序员学CFA——数量分析方法(三)

数量分析方法(三) 概率论基础概率论的基本概念概率论的相关术语随机变量结果随机事件 事件之间的关系互斥事件遍历事件独立事件 概率的定义与确定方法概率的定义概率的确定方法赔率条件概率 概率的计算乘法法则与加法法则联合概率与乘法法则加法法则 全概…

LeetCode257:二叉树的所有路径

题目描述 给你一个二叉树的根节点 root &#xff0c;按 任意顺序 &#xff0c;返回所有从根节点到叶子节点的路径。 叶子节点 是指没有子节点的节点。 解题思想 利用了回溯 代码 class Solution { public:void traversal(TreeNode* node, vector<int> &path, vect…

哈希 | unordered_set + unordered_map 的模拟实现(上)

目录 什么是 unordered_set unordered_map &#xff1f; unordered_set &#xff1a; unordered_map &#xff1a; 哈希 哈希表&#xff1a; 哈希冲突&#xff1a; 如何解决哈希冲突&#xff1a; 闭散列&#xff1a; 负载因子&#xff1a; 闭散列的模拟实现&#xff…

html公众号页面实现点击按钮跳转到导航

实现效果&#xff1a; 点击导航自动跳转到&#xff1a; html页面代码&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>跳转导航</title><meta name"keywords" conten…

【学习笔记十五】批次管理和容量管理

一、批次管理 1.配置 SAP EWM 特定参数 激活仓库的批次管理 2.ERP端物料需要启用批次管理 3.EWM物料需要启用批次管理 一般是ERP启用批次管理&#xff0c;相关的配置也会传输到EWM系统 4.建立批次主数据 5.创建采购订单并创建内向交货单&#xff0c;维护批次 6.维护产品主数…

【Canvas技法】绘制正三角形、切角正三角形、圆角正三角形

【图例】 【代码】 <!DOCTYPE html> <html lang"utf-8"> <meta http-equiv"Content-Type" content"text/html; charsetutf-8"/> <head><title>绘制正三角形、切角正三角形、圆角正三角形</title><style …

计算机网络—传输层UDP协议:原理、应用

​ &#x1f3ac;慕斯主页&#xff1a;修仙—别有洞天 ♈️今日夜电波&#xff1a;2月のセプテンバー 1:21━━━━━━️&#x1f49f;──────── 5:21 &#x1f504; ◀️ ⏸ ▶️ ☰ &am…

leetcode.45题:跳跃游戏II

Leetcode.45题&#xff1a;跳跃游戏II /* 题意的理解&#xff1a; nums[0] 只能跳 1 ~ nums[0]步 依次类推&#xff1a;从nums[0] - nums[n - 1] 最少需要多少步数 nums 2 3 1 1 4 nums[0] 2,初始只能跳 1/2步&#xff0c;如跳1步&#xff0c;达到nums[1] 而nums[1] 3,顾第二…

网络篇04 | 应用层 mqtt(物联网)

网络篇04 | 应用层 mqtt&#xff08;物联网&#xff09; 1. MQTT协议介绍1.1 MQTT简介1.2 MQTT协议设计规范1.3 MQTT协议主要特性 2 MQTT协议原理2.1 MQTT协议实现方式2.2 发布/订阅、主题、会话2.3 MQTT协议中的方法 3. MQTT协议数据包结构3.1 固定头&#xff08;Fixed header…

uboot操作指令2

文章目录 一、FAT 格式文件系统操作命令1.fatinfo 命令2.fatls 命令3.fstype 命令4.fatload命令-将EMMC数据复制到DRAM中4.fatwrite命令-将DRAM数据复制到EMMC中 二、Boot操作指令1.bootz2.boot命令 一、FAT 格式文件系统操作命令 &#x1f4a6; 有时候需要在 uboot 中对 SD 卡…

MYSQL08_页的概述、内部结构、文件头、文件尾、最大最小记录、页目录、区段表

文章目录 ①. 页的概述、大小②. 页的内部结构③. 第一部分 - 文件头④. 第一部分 - 文件尾⑤. 第二部分 - 空闲、用户记录、最大最小⑥. 第三部分 - 页目录⑦. 第三部分 - 页面头部⑧. 从数据页角度看B树⑨. 区、段和表、碎片区 ①. 页的概述、大小 ①. 数据库的存储结构&…

云原生:10分钟了解一下Kubernetes架构

Kubernetes&#xff0c;作为当今容器编排技术的事实标准&#xff0c;以其强大的功能和灵活的架构设计&#xff0c;在全球范围内得到了广泛的应用和认可。本文将深入简出地探讨Kubernetes的核心架构&#xff0c;帮助大家了解Kubernetes&#xff0c;为今后的高效的学习打下良好的…

计算机网络 Cisco虚拟局域网划分

一、实验内容 1、分别把交换机命名为SWA、SWB 2、划分虚拟局域网 valn &#xff0c;并将端口静态划分到 vlan 中 划分vlan 方法一&#xff1a;在全局模式下划分vlan&#xff0c;在SWA交换机上创建三个vlan&#xff0c;分别为vlan2&#xff0c;vlan3&#xff0c;vlan4。 方…