生命周期函数

2019-11-29  本文已影响0人  未来在奋斗
export default {
    name:'Home',
    creadted(){//在组件创建的时候执行
        console.log()
}
}
mounted(){
  //在组件被挂载到挂载点的时候执行
}
updated(){
//界面刷新的时候就会执行
}
beforeDestroy(){
//销毁之前
}
destroyed(){
//销毁生命周期函数
}

生命周期

什么叫做vue的生命周期

一个vue的实例在它创建到销毁的一系列过程,就叫做生命周期

什么是生命周期钩子函数

在vue实例的生命周期中,某个特定时刻会自动触发的函数,就叫做生命周期的钩子函数

生命周期的钩子函数:

  1. beforeCreate 实例创建之前
    1. 拿不到数据与方法
    2. 拿不到真实的dom对象, this.$el
  2. created 实例创建成功
    1. 拿不到真实的dom对象, this.$el
    2. 能够拿到数据与方法
    3. 调用方法,发送异步请求等等。
  3. beforeMount 实例挂载之前
    1. 拿不到真实的dom对象, this.$el
  4. mounted 实例挂载完成
    1. 能够获取到真是的DOM对象,this.$el 有值了
    2. 调用方法,发送异步请求等等。
  5. beforeUpdate 实例更新之前
    1. 获取当前的数据的是话是旧数据
  6. updated 实例更新完成
    1. 真实DOM也更新完成。
  7. beforeDestroy 实例销毁之前
    1. 清除定时器
    2. 清除全局绑定的滚动条事件
    3. 清理工作
  8. destroyed 实例销毁完成

分为三个阶段

  1. 挂载(初始)阶段

    1. beforeCreate 实例创建之前
    2. created 实例创建成功
    3. beforeMount 实例挂载之前
    4. mounted 实例挂载完成
  2. 更新阶段

    1. beforeUpdate 实例更新之前
    2. updated 实例更新完成
  3. 销毁阶段

    1. beforeDestroy 实例销毁之前
    2. destroyed 实例销毁完成
上一篇 下一篇

猜你喜欢

热点阅读