文章目录
0.什么是vue的生命周期?有什么作用?
每个vue实例在被创建时都要经过一系列的初始化过程,在此过程中会运行叫做生命周期钩子的函数,可以让用户在不同阶段添加自己的代码
1.对vue生命周期的理解?
vue的生命周期分为8个阶段:创建前后,挂载前后,更新前后,销毁前后
- 创建前后
beforeCreate阶段:vue实例的挂载元素$el和数据对象data都为undefined,还没有初始化
created阶段:vue实例对象data有了,$el还没有
总结:beforeCreate阶段中$el和data都是undefined,created阶段中data已经初始化完成但$el还没有 - 挂载前后
beforeMount阶段:vue实例的$el和data都初始化完成,但是还没有挂载为真实DOM(还是虚拟DOM节点),data message还没替换
mounted阶段:vue实例挂载为真实DOM,data message成功渲染
总结:beforeMount阶段data和$el初始化完毕但还没有挂载成真实DOM,mounted阶段vue实例挂载完成 - 更新前后
当data发生变化时,会触发beforeUpdate和updated方法 - 销毁前后
当执行destroy方法后,对data的改变不会再触发生命周期函数,说明此时vue实例已经解除了事件监听和对DOM的绑定(但DOM结构依然存在)
2.第一次页面加载会触发哪几个钩子?
beforeCreate, created, beforeMount, mounted