2.vue生命周期钩子

vue2.0生命周期图文详解

什么是生命周期:

Vue实例有一个完整的生命周期,也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲
染、卸载等一系列过程,我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程,就是生命周
期。

特别值得注意的是created钩子函数和mounted钩子函数的区别

  1>.new Vue()创建Vue对象

  2>.beforeCreate() -----创建vue实例前的钩子函数,(可以在这加个loading事件 ) 

  3>.created() -----实例创建完成之后的钩子函数,(在这结束loading,还做一些初始化,实现函数自执行 )

  4>.beforeMount() ----- 开始挂载编译生成的html到对应的位置时触发的钩子函数,此时还没有将编译出的html渲染到页面上

  5>.mounted() ----- 将编译好的html挂载到页面完成后执行的钩子函数,此时可以进行发送ajax请求获取
数据的操作,进行数据初始化。注意:mounted()在整个实例生命内只执行一次

  6>.beforeUpdated() -----数据更新时调用,发生在虚拟DOM重新渲染和打补丁之前。

  7>.update() -----数据修改,重新渲染DOM之后调用改钩子。当钩子被调用时,DOM结构已经被更新,所以在钩子中可以执行依赖的DOM操作。

  8>.beforeDestory() ----- 实例销毁前调用的钩子函数

  14>.destoryed() ----- Vue实例销毁后,调用。(当前组件已被删除,清空相关内容)

你可能感兴趣的:(2.vue生命周期钩子)