vue3生命周期总结

onMounted()--组件被挂载之后被调用

onUpdated()--DOM 更新后被调用

onUnmounted()--组件实例被卸载之后调用

onBeforeMount()--组件被挂载之前被调用

onBeforeUpdate()--DOM 更新前被调用

onBeforeUnmount()--组件实例被卸载之前调用

onErrorCaptured()--捕获了后代组件传递的错误时调用

onRenderTracked()--组件渲染过程中追踪到响应式依赖时调用。

这个钩子仅在开发模式下可用,且在服务器端渲染期间不会被调用。

onRenderTriggered()--响应式依赖的变更触发了组件渲染时调用

这个钩子仅在开发模式下可用,且在服务器端渲染期间不会被调用。

onActivated()--若组件实例是 <KeepAlive> 缓存树的一部分,当组件被插入到 DOM 中时调用。

这个钩子在服务器端渲染期间不会被调用。

onDeactivated()--若组件实例是 <KeepAlive> 缓存树的一部分,当组件从 DOM 中被移除时调用。

这个钩子在服务器端渲染期间不会被调用。

onServerPrefetch()--在组件实例在服务器上被渲染之前调用

Vue2和Vue3的生命周期有一些区别。 在Vue2中,常用的生命周期钩子函数有beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroy和destroyed。这些钩子函数允许在组件的不同生命周期阶段执行一些操作。其中,beforeCreate和created钩子函数在组件实例创建之前和之后执行,beforeMount和mounted钩子函数在组件挂载之前和之后执行,beforeUpdate和updated钩子函数在组件更新之前和之后执行,beforeDestroy和destroyed钩子函数在组件销毁之前和之后执行。 而在Vue3中,除了保留了Vue2中的生命周期钩子函数外,还新增了一些新的钩子函数。其中,beforeUnmount钩子函数是在组件卸载之前执行,用来做一些清理操作。此外,Vue3还引入了renderTracked和renderTriggered两个新的钩子函数,用于跟踪渲染过程中的依赖和更新。 另外需要注意的是,Vue3中所有的生命周期钩子函数都可以作为组件选项直接导出,而不需要手动声明。 总结起来,Vue2和Vue3的生命周期有一些相似之处,如beforeCreate、created、beforeMount、mounted、beforeDestroy和destroyed等钩子函数。但Vue3新增了beforeUnmount、renderTracked和renderTriggered等钩子函数,同时还允许将生命周期钩子函数作为组件选项直接导出。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [vue2和vue3的生命周期](https://blog.csdn.net/m0_73481765/article/details/131468675)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值