vue 3响应式核心是ref和reactive：ref处理基础类型并需.value访问，模板中自动解包；reactive专用于对象数组且深层响应，不可解构赋值；computed声明派生状态；setup内组织逻辑并支持组合式函数复用。
Vue 3 的响应式能力主要靠 Composition API 实现，核心是 ref 和 reactive 两个函数。它们不是语法糖，而是响应式系统的入口，理解它们的用法和差异，就能快速上手大部分场景。
ref：处理基础类型和单个值
ref 适合字符串、数字、布尔值、null 等基础类型，也支持对象或数组（但不推荐用于深层对象）。它返回一个带 .value 属性的响应式包装对象。
- 在
<script setup></script>中使用时，必须通过.value读写，比如count.value++ - 在模板中自动解包，直接写
{{ count }}就行，不用加.value - 即使传入对象，ref 也只对最外层做响应式代理；深层属性变化不会触发更新（除非配合
shallowRef或toRefs）
reactive：专为对象和数组设计
reactive 接收一个普通对象或数组，返回一个 Proxy 代理后的响应式版本。它天然支持深层响应式，所有嵌套属性都可被追踪。
vue-component-analyzer
下载
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
- 无需
.value，直接操作属性，如user.name = '李四'或list.push('Vue3') - 不能用在解构后单独使用——比如
const { name } = user会丢失响应性，此时需用toRefs(user)解构 - 不支持对
reactive返回值重新赋值（如user = {...}），只能修改其内部属性
computed：声明派生状态
当某个值依赖其他响应式数据且需要缓存时，用 computed 创建计算属性。它返回一个只读的 ref，内部自动追踪依赖。
- 简单用法：
const doubleCount = computed(() => count.value * 2) - 带 getter/setter 的双向计算属性，适用于需要反向更新源数据的场景（如表单联动）
- 与普通 ref 不同，
computed的值不可直接赋值，否则报错
生命周期与逻辑复用准备
setup 函数是 Composition API 的执行上下文，所有响应式声明、方法定义、生命周期钩子都要在这里组织。
- 生命周期不再写在选项里，改用
onMounted、onUpdated等函数注册 - 逻辑可以抽成独立函数（如
useCounter()、useTheme()），便于跨组件复用 - 脚本中所有变量和函数默认“暴露”给模板，无需显式 return（
<script setup></script>语法下）
大量免费API接口：立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游，为数据API应用能力赋能！
