suspense 不改变 vue 组件生命周期钩子本身，但会推迟 default 插槽内组件的挂载时机，直到所有异步依赖（如异步组件加载、async setup 中的 promise）全部 resolve，此时 onbeforemount → onmounted 才依次执行；fallback 插槽组件则立即渲染并触发自身生命周期，不受 suspense 异步流程影响。
Suspense 不改变 Vue 组件本身的生命周期钩子，但它会推迟 default 插槽内组件的挂载时机，直到所有异步依赖（如异步组件加载、async setup 中的 Promise）全部 resolve。这意味着：onBeforeMount、onMounted 等钩子不会在“组件标签写好就触发”，而是在 Suspense 确认内容可渲染后才执行。
默认插槽组件的生命周期被延迟触发
包裹在 #default 中的组件（比如 <userprofile></userprofile>），其 setup() 函数和生命周期钩子实际运行时间点，取决于 Suspense 的完成状态：
- setup() 内部若有 await（例如
const data = await api.getUser()），整个 setup 会暂停，Suspense 持续显示 fallback - 只有所有 await 都结束、组件实例创建完成，Suspense 才切换到 default 插槽，并触发 onBeforeMount → onMounted
- 此时你看到的 mounted 时间，是“异步准备就绪后”的时间，不是模板解析完的时间
fallback 插槽组件独立运行，不参与等待
#fallback 中的内容（比如 <loadingspinner></loadingspinner>）会立即渲染、立即挂载，它的生命周期不受 Suspense 异步流程影响：
vue-component-analyzer
下载
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
- LoadingSpinner 的 onMounted 会在 Suspense 渲染时立刻执行，常用于启动骨架动画或计时器
- 它不会等 async setup 完成，也不会因异步失败而卸载——除非 Suspense 切换成功，它才被移除
- 适合放纯展示型、无副作用的轻量组件，避免在 fallback 里做数据请求或复杂逻辑
错误与超时不会中断生命周期流，但会阻止 default 渲染
Suspense 本身不抛错，也不终止父组件生命周期；它只是“卡住” default 渲染：
- 若 async setup 抛出未捕获错误，Suspense 保持显示 fallback，default 内容永不挂载 → 对应组件的 onMounted 永远不会执行
- defineAsyncComponent 配置了
errorComponent，错误时 fallback 会被替换为该组件，但原组件生命周期依然不触发 - 没有内置超时机制，需靠
Promise.race()或组件内部 abort 控制，否则可能无限等待
父子组件生命周期顺序仍守序，但整体延后
一个含 Suspense 的父组件 + 其 default 中的子组件，生命周期顺序仍是：父 beforeMount → 父 mounted（如果无异步）→ 子 beforeMount → 子 mounted。但关键区别在于：
- 如果父组件自身有 async setup，它自己的 mounted 也会被推迟
- 如果子组件在 Suspense default 中，它的整个生命周期链条都后移，且严格依赖 Suspense 的“就绪信号”
- 父组件无法在子组件 mounted 前拿到子组件实例（
ref为空），因为 ref 赋值发生在 mounted 之后
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
