美文网首页
生命周期函数

生命周期函数

作者: 未来在奋斗 | 来源:发表于2019-11-29 17:42 被阅读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 实例销毁完成

相关文章

  • React生命周期函数

    生命周期函数 生命周期函数性能优化 生命周期函数发送Ajax请求

  • Vue学习笔记(12)-生命周期函数

    生命周期函数 生命周期函数代表的是Vue实例,或者是Vue组件,在网页中各个生命阶段所执行的函数。生命周期函数可以...

  • React的生命周期函数

    一、生命周期函数的定义 在某个时刻自动被调用的函数是生命周期函数 二、React中生命周期函数示意图 三、生命周期...

  • Vue的生命周期函数

    创建期间的生命周期函数: beforeCreate() 在beforeCreate() 生命周期函数执行的时候,...

  • RN-生命周期函数(新)

    旧版生命周期函数 react 16.4 以后生命周期函数 http://projects.wojtekmaj.pl...

  • Vue 生命周期

    生命周期函数 生命周期函数就是 Vue 实例在某一个时间点会自动执行的函数 简单来说就是,钩子(生命周期函数)就好...

  • Vue3.X学习笔记

    引用 创建应用app和挂载 或者 生命周期函数 生命周期函数,生命周期函数你可以这样理解,就是在** 在某一时刻会...

  • uni-app的基本语法和规范

    生命周期函数

  • Vue生命周期函数调用的时间

    vue的生命周期函数有11个,常用的8个生命周期函数必须要掌握

  • 微信小程序生命周期

    小程序有以下声明周期 onLoad 生命周期函数--监听页面加载 onReady 生命周期函数--监听页面初次渲染...

网友评论

      本文标题:生命周期函数

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