Vue的生命周期

生命周期:                        

1.又名:生命周期回调函数、生命周期函数、生命周期钩子。                       

 2.是什么:Vue在关键时刻帮我们调用的一些特殊名称的函数。                       

 3.生命周期函数的名字不可更改,但函数的具体内容是程序员根据需求编写的。                      

 4.生命周期函数中的this指向是vm 或 组件实例对象。




Vue生命周期流程图


vue 生命周期分析

1) 初始化显示

* beforeCreate()

* created()

* beforeMount()

* mounted()

2) 更新状态: this.xxx = value

* beforeUpdate()

* updated()

3) 销毁 vue 实例: vm.$destory()

* beforeDestory()

* destoryed()


常用的生命周期钩子:

    1.mounted: 发送ajax请求、启动定时器、绑定自定义事件、订阅消息等【初始化操作】。

     2.beforeDestroy: 清除定时器、解绑自定义事件、取消订阅消息等【收尾工作】。

关于销毁Vue实例

     1.销毁后借助Vue开发者工具看不到任何信息。

      2.销毁后自定义事件会失效,但原生DOM事件依然有效。

      3.一般不会在beforeDestroy操作数据,因为即便操作数据,也不会再触发更新流程了。



面试相关考点:

1.Vue 的生命周期请简述

vue 的生命周期就是 vue 实例创建到实例销毁的过程。期间会有 8 个钩

子函数的调用。

beforeCreate(创建实例)

created(创建完成)、

beforeMount(开始创建模板)

mounted(创建完成)、

beforeUpdate(开始更新)

updated(更新完成)、

beforeDestroy(开始销毁)

destroyed(销毁完成)

2.生命周期的作用

给了用户在不同阶段添加自己的代码的机会

3.Vue 生命周期一共几个阶段

创建 加载 更新 销毁

Beforecreate 创建前

Created 创建后

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Vue 生命周期 从生到死的过程,从Vue实例创建-运行-销毁的过程 Vue实例有一个完整的生命周期,也就是从开始...
    前端菜菜1号阅读 320评论 0 0
  • 前言 使用Vue在日常开发中会频繁接触和使用生命周期,在官方文档中是这么解释生命周期的: 每个 Vue 实例在被创...
    心_c2a2阅读 2,292评论 1 8
  • Vue--生命周期 1、Vue 生命周期状态和方法 这里说的 Vue 的生命周期指的是 Vue 组件的生命周期 先...
    Train12阅读 571评论 0 2
  • 每个vue实例从创建到销毁的过程都是一个生命周期,也会运行对应的钩子函数,下图为Vue生命周期示意图: 1.bef...
    Starkchen阅读 1,249评论 0 0
  • 参考:https://cn.vuejs.org/v2/guide/instance.html 每个 Vue 实例在...
    玲儿珑阅读 375评论 0 0