码迷,mamicode.com
首页 > 其他好文 > 详细

详解Vue生命周期

时间:2020-04-26 11:22:12      阅读:69      评论:0      收藏:0      [点我收藏+]

标签:mes   阶段   png   org   remount   数据   没有   内容   rem   

下图是vue官网的VUE实例生命周期图示:
技术图片

按照图示,我们能解读到哪些内容呢?

  1. vue生命周期分为8个阶段: 创建前/后,载入前/后,更新前/后,销毁前/后
  2. 在创建前,即beforeCreate阶段,vue实例的的挂在元素和数据对象data都为undefined,还未初始化。
  3. created阶段,vue实例的数据对象data已经有了,el还没有
  4. 在载入前,及beforeMount阶段,vue实例的$eldata都初始化了,但还是挂载之前为虚拟的dom节点,data.message还未替换。
  5. mounted阶段,vue实例挂载完成,data.message成功渲染。
  6. 更新前/后:当data变化时,会触发beforeUpdateupdated方法
  7. 销毁前/后:在执行destroy方法后,对data的改变不会再触发周期函数,说明此时vue实例已经解除了事件监听以及和dom的绑定,但是dom结构依然存在

详解Vue生命周期

标签:mes   阶段   png   org   remount   数据   没有   内容   rem   

原文地址:https://www.cnblogs.com/vipUser/p/12777460.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!