＜script setup＞ 语法糖

下面，我们来系统的梳理关于 Vue 3

二、核心语法与特性

2.1 基本结构

2.2 编译器转换原理

输入：

输出：

2.3 自动暴露规则

• 所有 import 导入
• 顶层变量声明 (const, let, var)
• 顶层函数声明
• 顶层 class 和 interface (TypeScript)

三、组件与指令使用

3.1 组件使用

3.2 动态组件

3.3 自定义指令

四、Props与Emit处理

4.1 声明Props

4.2 声明Emit事件

五、响应式与生命周期

5.1 响应式状态管理

5.2 生命周期钩子

六、高级特性与模式

6.1 顶层await

6.2 使用插槽与上下文

6.3 暴露组件实例

七、TypeScript集成

7.1 类型安全Props

7.2 泛型组件

7.3 类型标注Ref

八、最佳实践与组织模式

8.1 代码组织建议

8.2 逻辑复用模式

8.3 性能优化

九、常见问题与解决方案

9.1 响应式丢失问题

问题：解构Props导致响应式丢失

解决方案：

9.2 命名冲突问题

问题：导入组件与局部变量同名

解决方案：

9.3 访问上下文问题

问题：无法直接访问 this

解决方案：