vue官网生命周期图

个人明白

• beforeCreate

  实例组件刚建立好，设置数据观察（observe data）之前的阶段。el和data还未初始化。
  在此阶段，平常处置惩罚loading事宜之类的事变。

• created

  实例建立完成，完成属性绑定，这个阶段DOM并没有天生，$el属性不存在。el未初始化，data初始化。
  此阶段，异步数据的要求操纵宜在此挪用，完成完毕loading，做一些初始化处置惩罚，完成一些函数的自实行。

• beforeMounted

  模板编译之前的阶段。el和data完成初始化，computed盘算属性中，只变动一次的属性会在此阶段加载。

• mounted

  完成模板编译以后的阶段。页面的vue指令编译成html代码，比方：<p @lick="fun1">{{message}}</p> 会编译成 <p onclick="fun1">compile completed!</p>。
  此阶段，平常向后端提议要求，取到数据以后，合营钩子做一些处置惩罚。

• beforeUpdated

  数据更新时挪用，发生在假造 DOM 从新衬着和打补丁之前，该阶段不会触发附加的重衬着历程，该钩子在服务器端衬着时期也不会被挪用。

• updated

  因为数据变动致使的假造 DOM 从新衬着和打补丁，在这以后会挪用该钩子。
  当这个钩子被挪用时，组件 DOM 已更新，所以你如今能够实行依赖于 DOM 的操纵。
  平常在此钩子出做一致数据更新操纵，假如须要辨别差别数据的更新，同时操纵DOM，能够运用nextTick函数。

• activated
  keep-alive 组件激活时挪用。
• deactivated
  keep-alive 组件停用时挪用。
• beforeDestroy
  实例烧毁之前挪用。在这一步，实例依然完整可用。
• destroy
  Vue 实例烧毁后挪用。挪用后，Vue 实例指导的一切东西都邑解绑定，一切的事宜监听器会被移除，一切的子实例也会被烧毁。