Vue3 生命周期

• vue3 中只有 beforeDestroy 和 destroyed 名字变了

• vue2 中生命周期使用的是对象上 option，vue3 使用的是 api

• setup 是围绕 beforeCreate 和 created 生命周期钩子运行的,这两个周期里面的代码都可以在 setup 中编写

• vue2 的声明周期可以在3中写

  • beforeCreate -> 使用 setup()
  • created -> 使用 setup()
  • beforeMount -> onBeforeMount
  • mounted -> onMounted
  • beforeUpdate -> onBeforeUpdate
  • updated -> onUpdated
  • beforeDestroy -> onBeforeUnmount
  • destroyed -> onUnmounted
  • errorCaptured -> onErrorCaptured
  • activated -> onActivated
  • deactivated -> onDeactivated

• 新增

  • renderTracked -> onRenderTracked
  • renderTriggered -> onRenderTriggered

• 父子生命周期加载顺序

  • parent-beforeCreate
  • parent-created
  • parent-onBeforeMount
  • parent-beforeMount
  • child-beforeCreate
  • child-created
  • child-onBeforeMount
  • child-beforeMount
  • child-onMounted
  • child-mounted
  • parent-onMounted
  • parent-mounted

• 更新

  • child-onBeforeUpdate
  • child-beforeUpdate
  • child-onUpdated
  • child-updated