必须用 .value 是因为 ref 返回的是响应式对象而非原始值，Vue 依赖其 value 属性追踪变化；直接赋值会丢失响应式连接，模板中自动解包故无需 .value。
在 Vue 3 中，ref 创建的是一个响应式引用对象，要修改它的值，必须通过 .value 属性赋值，不能直接给 ref 变量本身赋新值。
为什么必须用 .value？
ref(10) 返回的不是原始数字 10，而是一个包含 value 属性的对象（例如 { value: 10 }）。Vue 的响应式系统依赖这个对象结构来追踪变化。直接写 count = 20 只是重新赋值了变量，会丢失响应式连接。
在 setup() 中修改 ref 值的正确写法
在 setup() 或组合式 API 的脚本中：
Springboot Vue Builder
下载
从零开始编排 SpringBoot+Vue 全栈项目工作流，适用于新建全栈项目或完整脚手架请求，触发后依次调用 product‑spec‑builder（需求调研）等模块。
- 定义时：使用
const count = ref(0) - 读取时：用
count.value（如console.log(count.value)） - 修改时：赋值给
count.value（如count.value = 5或count.value++）
在模板中不需要 .value
Vue 模板中自动解包 ref，所以模板里直接写 {{ count }} 即可，不用写 {{ count.value }}。这是 Vue 的语法糖，仅限模板内生效。
立即学习“前端免费学习笔记（深入）”；
常见错误示例
以下写法无法触发响应式更新：
-
count = ref(100)—— 覆盖了原 ref 引用，失去响应性 -
count = 20—— 把 ref 变量变成了普通数字，不再是响应式对象 -
const newCount = count然后改newCount.value—— 可以，但没必要；直接改count.value更清晰
