生命是生命周期:从
Vue
实例创建、运行、到销毁期间,总是伴随着各种各样的事件,这些事件统称为生命周期生命周期钩子 = 生命周期函数 = 生命周期事件
-
vue 生命周期图
-
主要的生命周期分类:
- 创建期间的生命周期函数:
beforeCreate
:刚初始化了一个Vue
空的实例对象,这个对象身上,只有默认的一些生命周期函数和默认的事件,data
和methods
还没有初始化
created
:data
和methods
已经初始化完成,此时还没有开始编译模板
beforeMount
: 此时已经完成了模板的编译,但是还没有挂载到页面中
mounted
:此时,已经将编译好的模板,挂载到了页面指定的容器中显示 - 运行期间的生命周期函数: (
data
变化时执行)
beforeUpdate
:状态更新之前执行此函数,此时data
中的状态值是最新的,但是界面上显示的数据还是旧的,因为此时还没有重新渲染DOM
节点
updated
:实例更新完毕之后调用此函数,此时data
中的状态值和界面上显示的数据都已经完成了更新,界面已经被重新渲染好了 - 销毁期间的生命周期函数
beforeDestroy
:实例销毁之前调用,在这一步,实例任然完全可用,此时,还没有真正执行销毁的过程:
destroyed
:Vue
实例销毁后调用,实例已经被完全被销毁,此时,组件中所有的数据、方法、指令等都已经不可用了
- 创建期间的生命周期函数:
vue实例的生命周期
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...