美文网首页
Vue实例的生命周期

Vue实例的生命周期

作者: 瑞破破 | 来源:发表于2018-12-08 13:42 被阅读0次

什么是生命周期

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

生命周期钩子

生命周期钩子就是生命周期事件的别名
生命周期钩子 = 生命周期函数 = 生命周期事件

主要生命周期的函数分类

  • 创建期间的生命周期函数:
    1、beforeCreate:实例刚被创建出来,此时还没有初始化好data和methods属性
    2、created:实例已经创建好了,data和methods已经创建好,此时还没有开始编译模板
    3、beforeMount:完成了模板的编译,但还没有挂载到DOM节点
    4、mounted:已经将编译好的模板,挂载到了页面指定的容器中显示
  • 运行期间的生命周期函数:
    1、beforeUpdate:状态更新前,此时data中的状态时最新的,但是界面显示的还是旧的,因此还没有重新渲染DOM节点
    2、update:实例更新完毕之后,此时data中的状态值和界面显示的数据,都已经完成了更新,界面已经被重新渲染好
  • 销毁期间的生命周期函数 :
    1、beforeDestroy:实例销毁之前调用,实例仍然可用
    2、destroyed:实例销毁后调用。调用后,Vue实例指示的所有东西都会解绑定,所有的事件监听器会被移出,左右的子实例也会被销毁

相关文章

  • Vue.js入门(二):生命周期

    1 生命周期 Vue生命周期是Vue实例从创建到销毁的过程,就是生命周期。在Vue实例的生命周期过程中会运行生命周...

  • vue学习第二课之vue的生命周期

    vue生命周期图解: vue实例的生命周期 什么是生命周期:从Vue实例创建、运行、到销毁期间,总是伴随着各种各样...

  • vue生命周期

    一 vue生命周期 Vue的生命周期:就是vue实例从创建到销毁的全过程 二 vue生命周期钩子 vue生命周期...

  • 10、Vue_生命周期

    实例的生命周期 实例的生命周期图示(选项/生命周期钩子)实例生命周期 解释1.var v = new Vue{}:...

  • Vue生命周期

    vue生命周期 vue实例的创建到销毁的过程就是vue的生命周期,也就是实例创建-->初始化数据-->编译模板--...

  • 一、vue基础知识点

    每个 Vue 应用都是通过用 Vue 函数创建一个新的 Vue 实例开始的: 实例生命周期钩子 每个 Vue 实例...

  • Vue

    Vue框架 一、Vue基础 添加Vue到网页(无需保存到本地) Vue生命周期 二、Vue 实例 创建Vue实例:...

  • VUE实例生命周期钩子

    1、vue实例生命周期钩子的由来 每个vue应用都是通过vue函数创建一个新的vue实例开始的: vue实例再被创...

  • 前端之路-VUE面试题

    vue生命周期面试题vue 生命周期是什么? Vue 实例从创建到销毁的过程,就是生命周期 beforeCreat...

  • 2.Vue实例生命周期

    Vue实例有一个完整的生命周期,顾名思义就是指Vue实例从创建到销毁的过程。下面将借助官网上的Vue实例生命周期示...

网友评论

      本文标题:Vue实例的生命周期

      本文链接:https://www.haomeiwen.com/subject/hblqhqtx.html