个人摄影作品网站,做网站 推广,php asp网站开发,海珠区 网站设计什么是vue的生命周期#xff1f;
Vue 的实例从创建到销毁的过程 #xff0c;就是生命周期 #xff0c;也就是从开始创建 #xff0c;初始化数据 #xff0c;编译模板 #xff0c;挂载Dom到渲染DOM #xff0c;更新数据再到渲染 #xff0c;卸载等一系列的过程 #x… 什么是vue的生命周期
Vue 的实例从创建到销毁的过程 就是生命周期 也就是从开始创建 初始化数据 编译模板 挂载Dom到渲染DOM 更新数据再到渲染 卸载等一系列的过程 我们称这是Vue的生命周期而这些Vue生命周期过程中会伴随着一些函数的自调用。我们称这些函数为钩子函数。 一、vue生命周期示意图 二、Vue生命周期的作用是什么
Vue生命周期过程中会伴随着多个事件钩子 这些钩子函数让我们在控制整个Vue实例的过程时更容易形成好的逻辑。Vue生命周期总共分8个阶段创建前/后 载入前/后 更新前/后 销毁前/后。
1.创建阶段
在这个阶段Vue 实例正在初始化它会在内存中创建一个实例并对实例进行初始化设置。在这个阶段Vue 会调用一些特定的函数来创建实例这些函数可以在组件中进行重写或自定义。
beforeCreate 在实例被创建之前调用此时组件实例的数据和方法都还未初始化。在这个阶段通常可以进行一些全局变量或实例属性的初始化设置可以加loading……事件 加载实列时触发。
created 在实例创建之后调用此时组件实例的数据和方法已经初始化完成但尚未被挂载到 DOM 上。在这个阶段通常可以进行一些数据的初始化、异步请求等操作loading……事件结束等。
2.挂载阶段
在这个阶段Vue 实例已经完成了初始化设置并将组件挂载到了 DOM 上可以进行渲染和交互了。
beforeMount 在组件挂载到 DOM 之前调用此时组件已经完成了模板编译但还未将组件挂载到实际的 DOM 上。
mounted 在组件挂载到 DOM 后调用此时组件已经完成了渲染和挂载可以进行 DOM 操作和交互。在这个阶段通常可以进行一些依赖于 DOM 的操作例如获取元素尺寸、绑定事件等可以使用一些第三方的插件实例写在这个函数内。
3.更新阶段
在这个阶段组件可能会被重新渲染或者被销毁。在组件被重新渲染时也会触发更新阶段的钩子函数。
beforeUpdate 在组件更新之前调用此时组件的数据已经发生了改变但尚未重新渲染。在这个阶段通常可以进行一些在数据更新前的操作例如获取更新前的状态、进行异步请求等。
updated 在组件更新之后调用此时组件的数据已经重新渲染完成可以进行 DOM 操作和交互。在这个阶段通常可以进行一些依赖于 DOM 的操作例如获取更新后的元素尺寸、重新绑定事件等。
4.销毁阶段
在组件被销毁时会触发销毁阶段的钩子函数。
beforeDestroy 在组件被销毁之前调用此时组件实例还没有被销毁但是已经从父组件中移除了。在这个阶段通常可以进行一些清理工作例如取消定时器、清除全局事件等。
destroyed 在组件被销毁之后调用此时组件实例已经完全被销毁无法访问到组件的数据和方法。在这个阶段通常可以进行一些最后的清理工作。 总结
要想学精vue生命周期必须知道什么阶段进行了什么操作我们可以在阶段上进行什么运算。vue八大阶段可以让我们更好的理解起逻辑进行开发。
