每一个Vue实例或者组件都有一个完整的生命周期,一个完整的生命周期包括初始化阶段、运行中阶段和销毁阶段。
初始化阶段:
1.实例、组件被创建出来以后,就会被初始化事件和生命周期。然后就会执行beforeCreate钩子函数,这个时候,数据没有被挂载到,也不能获取真实dom,只是一个空壳,一般不做操作。
2.挂载数据、绑定事件后,然后执行created钩子函数,这个时候可以获取到数据,一般在这个阶段做一些数据操作,比如ajax请求等异步请求。
3.找到实例或者组件的对应的模板,编译模板将虚拟dom放入到render函数中 马上就要进行渲染,然后执行beforeUpdate钩子函数,这个时候虚拟dom马上就要被渲染成真实dom,在这个阶段也可以进行一些数据的操作,并且不会因此而触发updated钩子函数。
4.render函数将虚拟dom被渲染成真实dom,然后执行created钩子函数,这个阶段既可以获取数据,也可以获取到真实dom,所以可以在这个 阶段进行dom的操作。
运行中阶段:
5.当组件、实例数据发生更改后,会立即执行beforeUpdate钩子函数,构建新的虚拟dom与之前的虚拟dom进行diff算法比较之后进行重新渲染,一般不做操作。
6.当更新完成后,执行updated,数据已经更改完成,dom也重新渲染,可以获取到更新后的数据。
销毁阶段:
7.当调用$distroy方法后,立即执行beforeDestroy钩子函数,一般可以在这里做一些善后操作,比如清除计时器等。
8.组件、实例的数据绑定和事件监听等去掉后只剩些一个dom空壳,然后执行distroyed钩子函数。
网友评论