Posts

Vue 3局部组件注册限定使用范围于父组件内，优势包括Tree-Shaking支持、依赖清晰、避免命名冲突。方法有二：script setup导入即能使用，选项式API需在components中注册。适用于大型项目、复用性低或性能优化场景，可减少打包体积，避免全局污染。

Vue 3全局组件注册通过app.component()实现，将组件注册到全局注册表可在任何组件使用，核心优势复用便捷。支持链式批量注册，命名推荐PascalCase。适用于频繁使用的基础组件，但大型项目中因无法tree-shaking优化及维护困难，建议优先局部注册。

Vue3组件注册核心是让框架识别组件，分为全局、局部、异步注册及内置组件。全局通过app.component()注册，适通用基础组件但增加体积；局部在组件内注册（options API用components，script setup导入即注册），推荐业务组件，利于代码组织；异步用defineAsyncComponent实现懒加载，提升性能；内置组件如Teleport等无需注册。

Vue3组件生命周期分创建、挂载、更新、销毁四阶段，提供选项式（组件选项定义钩子）与组合式（导入钩子函数）两种API。需注意created初始化数据、mounted操作DOM等场景，避免updated修改数据、异步注册组合式钩子等错误。

Vue SSR中仅beforeCreate/created在服务端执行，其他钩子（如mounted）仅客户端执行；自定义渲染器需适配平台钩子，如挂载时触发mounted。生命周期流程：客户端有完整钩子链，SSR服务端渲染后客户端激活继续。同构开发需避免服务端副作用，常见错误如window未定义等。

Vue3生命周期钩子优化需关注性能与陷阱。优化策略：onMounted聚焦必要操作，合并DOM操作，延迟非关键初始化；onUpdated用watch替代避免重复执行；onUnmounted及时清理定时器、事件监听等资源。陷阱：避免箭头函数导致this丢失，防止onUpdated无限循环，清理第三方库实例避免内存泄漏。