什么是生命周期
当前组件在创建到销毁的过程的一系列过程,称为 生命周期
生命周期分为三个阶段
1.初始化
2.运行中
3.销毁
初始化阶段
beforeCreate
组件创建前
data,RDOM(真实dom)获取不到
意义:是一个事件和生命周期的准备阶段
created
组件创建结束
data: 获取到了
RDOM: 没获取到
意义:获取数据(异步数据获取请求)
beforeMount
开始挂在组件
data: 获取到了
RDOM:没获取到
意义:获取数据(异步数据获取请求)
*作用:为组件的装载做准备工作,它看配置项中有没有el,如果template不存在,就手动装载,如果存在,就利用render函数进行渲染,这里的渲染是准备进行,
mounted
组件挂在结束
data,RDOM:都能获取到
意义:可以获取到DOM,可以获取到数据,生成了真实DOM,DOM的操作和第三方实例化可以进行了,获取数据
运行中
beforeUpdate
数据(组件)更新前的准备
data,RDOM:都获取到了
这个钩子函数里,只有数据改变了才能执行,
生成新的 VDOM , 然后通过diff算法进行两次VDOM 对比(都是内部进行的),所以在真实项目中一般不适用
updated
数据(组件)更新完毕
通过render函数将Vdom渲染了真实dom,然后驱动vue进行试图的更新
动态数据的渲染,进行dom操作(第三方库的实例化)
销毁阶段
beforeDestory
数据(组件)即将销毁
destoryed
数据(组件)销毁完毕
组件销毁的两种方式
- 使用$destory()方法------内部销毁-----会将组件模板保留下来
- v-if----------外部销毁
这两个钩子函数执行的是一样的功能,主要是善后工作,常用来清除一些计时器和方法以及第三方实例