vue2和vue3生命周期对比

下面的是vue2和3的生命周期对比，

下面的两张图是官网的图示：

vue2生命周期                                                          vue3生命周期

与 2.x 版本生命周期相对应的组合式 API

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

示例代码：

目录结构如下：

 App.vue

Child.vue

根据示例代码：

初始化项目运行

 点击更新数据后：

 点击切换展示：

 

对比可以发现 2.x和3.x运行的情况下是：

在运行情况下：3.x运行早于2.x

3.x的生命周期等在使用时都需要引入