Vue 生命周期

原创于 2020-05-08 22:34:59 发布 · 135 阅读

0 ·

CC 4.0 BY-SA版权

前端专栏收录该内容

6 篇文章

订阅专栏

本文详细解析了Vue.js的生命周期钩子，包括beforeCreate、created、beforeMount、mounted、beforeUpdate和updated等关键阶段的功能与调用时机，帮助开发者深入理解Vue组件的运行流程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//在实例初始化之后，数据观测 (data observer) 和 event/watcher 事件配置之前被调用。
   beforeCreate:function(){
       console.log('beforeCreate');
   },
   /* 在实例创建完成后被立即调用。
   在这一步，实例已完成以下的配置：数据观测 (data observer)，属性和方法的运算，watch/event 事件回调。
   然而，挂载阶段还没开始，$el 属性目前不可见。 */
   created   :function(){
       console.log('created');
   },
   //在挂载开始之前被调用：相关的渲染函数首次被调用
   beforeMount : function(){
       console.log('beforeMount');

   },
   //el 被新创建的 vm.$el 替换, 挂在成功
   mounted : function(){
       console.log('mounted');

   },
   //数据更新时调用
   beforeUpdate : function(){
       console.log('beforeUpdate');

   },
   //组件 DOM 已经更新, 组件更新完毕
   updated : function(){
       console.log('updated');

   }