阅读 467
vue的生命周期-从出生到销毁的过程

vue的生命周期-从出生到销毁的过程

一. Vue生命周期介绍

生命周期的含义: 从Vue实例创建,运行,到销毁期间,总是伴随着各种各样的事件,这些事件统称为生命周期

常见叫法: 生命周期钩子 == 生命周期函数 == 生命周期事件

二、创建阶段

  • beforeCreate:实例在内存中创建出来,但未初始化 data和 methods

  • created: 实例已经在内存中创建完成,此时data和methods已初始化

  • beforeMount: 此时已经完成了模版的编译,只是还没有渲染到界面中去

  • mounted: 模版已经渲染到了浏览器,创建阶段结束,即将进入运行阶段(最新的dom)

三、运行阶段

  • beforeUpadte:界面中的数据还是旧的,但是data数据已经更新,页面中和data不会保持同步

  • updated: 页面重新渲染完毕,页面中的数据和data保持一致

三、销毁阶段

  • beforeDestroy:执行该方法的时候,Vue的生命周期已经进入销毁阶段,但是实例上的各种数据和方法还处于可用状态

  • destroyed: 组件已经全部销毁,Vue实例已经被销毁,Vue中的任何数据都不可用

四、生命周期解析图

这张图对官网的图做出更加详细地解释,我是在其他倔友那下载下来的,手机端可以保存。
vue生命周期非常重要,明白各阶段做了什么事情可以更好地进行项目开发。
复制代码

4bc6539a019a48279716eb67f58e9bc.jpg

文章分类
前端
文章标签