-
Vue的生命周期跟我们一样,你知道吗?
Vue的生命周期
组件的创建到销毁的过程就叫vue的生命周期
-
vue生命周期钩子官方文档：
- 官方文档图解介绍：生命周期图示
- 官方文档详细介绍：vue生命周期钩子介绍
-
==vue生命周期钩子介绍 ： vue从创建到销毁过程中，会执行的一些回调函数 ==
钩子： 一种回调函数- 例如
- window.onload = function(){ dom加载完毕，外部资源加载完毕就执行 }
- 例如
生命周期： vue实例从出生到扑街的过程- 出生：
- 创建vue实例
- 创建data数据
- 创建el挂载点
- 将data数据渲染到el挂载点
- 扑街
- vue实例被销毁
- 这里销毁不是指vue实例变成了null，而是指解除data与el的关联
- 说人话：修改了data，页面不会被渲染
- 这里销毁不是指vue实例变成了null，而是指解除data与el的关联
- vue实例被销毁
- 出生：
-
注意点
- 根据官网文档介绍 ： 每一个生命周期钩子中的this都是指向vue实例
- 所以，生命周期钩子
不能是箭头函数
vue的生命周期钩子分为四大阶段,8个方法
初始化
挂载
更新
销毁执行顺序 钩子函数 执行时机 1 beforeCreate(){}vue实例创建了，但是el和data还没有创建 （准备创建data） 底层（初始化vue实例，初始化钩子函数，初始化一些事件和侦听器配置项） 2 created() {}data数据创建了，但是el挂载点还没有创建 (准备创建el) 底层：初始化data中的数据和methods中的方法 3 beforeMount() {}el挂载点创建了，但是data数据还没有渲染（准备渲染中） 底层：创建el挂载点，并且生成虚拟DOM 4 mounted() {}data数据 第一次 渲染完毕 (完成初始渲染) 底层：将虚拟dom渲染成真实DOM 5 beforeUpdate() {}检测到data数据变化，但是还没有开始重新渲染 (data变了，准备重新渲染中) 会执行多次6 updated() {}变化后的data数据 ，完成渲染到页面 （完成重新渲染） 会执行多次7 beforeDestroy() {}vue实例销毁即将销毁(解除data与el的关联),之后修改data，页面不会被渲染 底层 ： 解除 事件绑定、侦听器、组件 8 destroyed() {}vue实例已经销毁 -
-
相关阅读:
面向对象思想理论
数据分析：智能企业七步曲（一）
《设计模式》桥接模式
Nocas为什么会在SpringBoot启动完就会注册呢？
[Ext JS]图片显示方式
leetcode - 2939. Maximum Xor Product
c++后台开发适合入坑吗？就业前景如何？
关于安卓毛玻璃实现（二）动态毛玻璃recyclerview
【C++】 AVL树
走进Spark
- 原文地址：https://blog.csdn.net/m0_62371650/article/details/126941745