vue 3组合式api中生命周期函数须在setup或中使用,需从'vue'显式导入onmounted等钩子,不支持created/beforecreate,销毁钩子更名为onbeforeunmount/onunmounted,且同一钩子可多次注册。

Vue 3 组合式 API 中的生命周期函数必须在 setup 函数或 <script setup></script> 语法糖中使用,不能直接写在组件顶层;它们以 on 开头 + 生命周期阶段名 的形式命名,且需显式导入后调用。
必须导入再使用
所有生命周期钩子都是独立函数,需从 'vue' 显式导入,否则无法识别:
-
onMounted、onUnmounted、onUpdated等都属于具名导出,不默认可用 - 常见写法:
import { onMounted, onBeforeUnmount } from 'vue' - 未导入就调用会报错:
ReferenceError: onMounted is not defined
只支持 onXxx 形式,没有 created 和 beforeCreate
组合式 API 中取消了选项式里的 created 和 beforeCreate 钩子:
- 组件初始化逻辑直接写在
setup()函数体顶部(即脚本开始执行时) -
setup本身相当于beforeCreate+created的合并时机 - 不要尝试写
onCreated—— 它不存在,也不被 Vue 解析
卸载相关钩子已更名
Vue 3 统一将“销毁”语义改为“卸载”,对应钩子也同步更新:
-
beforeDestroy→onBeforeUnmount -
destroyed→onUnmounted - 旧名在组合式 API 中完全不可用,即使导入也不会生效
可多次注册同一钩子
同一个生命周期钩子可以调用多次,回调按注册顺序依次执行:
- 例如两个
onMounted(() => {...}),都会在挂载后运行 - 适合模块化组织逻辑,比如一个负责 DOM 操作,另一个负责接口请求
- 无需手动合并逻辑,Vue 内部自动排队执行
大量免费API接口:立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游,为数据API应用能力赋能!










