ref()用于创建基本类型响应式变量，返回带.value属性的对象；js中需通过.value读写，模板中直接使用变量名；reactive()仅支持对象/数组，对基本类型无效。
直接用 ref() 包裹初始值即可，比如 ref(0)、ref('hello')、ref(true)。它会返回一个带 .value 属性的响应式对象，JS 中读写必须加 .value，模板中直接用变量名。
怎么创建 ref 变量
在 <script setup></script> 中导入并调用：
- import { ref } from 'vue'
- const count = ref(0) —— 创建数字型响应式变量
- const name = ref('Alice') —— 创建字符串型响应式变量
- const isActive = ref(false) —— 创建布尔型响应式变量
JS 里怎么读写 ref 的值
必须通过 .value 访问或修改，否则不会触发响应式更新：
-
console.log(count.value) —— 输出
0 - count.value += 1 —— 正确：值变，视图自动刷新
- count++ 或 count = 5 —— 错误：不触发更新，也不报错，但无效
模板中怎么用 ref 变量
不用写 .value，直接当普通变量用：
-
{{ count }}
—— 显示0，后续自动更新 欢迎 {{ name }}
为什么基本类型要用 ref 而不是 reactive
reactive() 只接受对象或数组，传入字符串、数字等会静默失败或报错：
- reactive('hello') → 不生效，返回原字符串（非响应式）
- reactive(42) → 报错或警告（Vue 会提示“不能将基本类型转为响应式”）
- 而 ref('hello') 和 ref(42) 都能正常工作
大量免费API接口：立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游，为数据API应用能力赋能！
