vue常用特性之生命周期

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接： https://blog.csdn.net/poppy995/article/details/98172625

生命周期

---

主要阶段

• 挂载(初始化相关属性)
  beforeCreate
  created
  beforeMount
  mounted
  页面渲染完成后调用这个钩子函数 在服务器端渲染期间不会被调用
• 更新(元素或组件的变更操作)
  beforeUpdate
  updated
• 销毁(销毁相关属性)
  beforeDestory
  destroyed
  销毁触发时需要一个特殊的方法 this.$destroy() 会把data和methods中的相关的资源销毁 不需要这个vue实例时进行销毁，为了节省一些资源
  这些方法触发的时机不同，可以在创建vue实例对象的参数中进行设置，不用写在methods中

---

实例的产生过程

1. beforeCreate 在实例初始化之后，数据观测和事件配置之前被调用
2. created在实例创建完成后被立即调用
3. beforeMount在挂载开始之前被调用
4. mounted el被新创建的vm.$el替代，并挂载到实例上去之后调用该钩子
5. beforeUpdate 数据更新时调用，发生在虚拟DOM打补丁之前。
6. updated 由于数据更改导致的虚拟DOM重新渲染和打补丁，在这之后会调用该钩子
7. beforeDestory 实例销毁之前调用
8. destroyed 实例销毁后调用

---

mounted 是这个阶段中最重视的一个钩子函数，在这个钩子函数中，我们可以调用后台接口，获取数据，对页面进行渲染