响应式与计算属性
你将学会什么
Section titled “你将学会什么”- 分清
ref与reactive的适用场景 - 正确读写
ref的.value与reactive的对象引用 - 用
computed声明派生状态，避免在模板里堆复杂表达式
ref 适合简单值，比如字符串、数字、布尔值；reactive 更适合对象或数组，尤其是多个字段会一起变化的时候。你不需要强行统一成某一种，更实用的做法是：
- 单个基础值用
ref - 表单对象、列表数据、配置项用
reactive - 需要跨组件共享状态时，再考虑
Pinia或provide/inject
初学者最常见的问题，是把 ref(0) 当成普通变量去修改，或者对 reactive 包裹的对象直接赋值整个对象。记住：ref 用 .value，reactive 保持对象引用稳定。
在 ref 之上，computed 用来声明派生状态——它的核心价值不是“缓存变量”，而是“根据已有状态算出新值”：
import { ref, computed } from 'vue'
const count = ref(0)const double = computed(() => count.value * 2)
function increment() { count.value += 1}computed 适合用在：根据列表筛选结果计算统计值、根据表单输入动态生成摘要、根据多个状态组合出是否可提交。不适合用在：会主动修改状态的计算逻辑、依赖异步副作用的场景。如果你发现自己写了一个“会改其他值”的计算属性，通常说明这里应该用函数，而不是 computed。
先自己回答，再看答案：
ref和reactive分别适合什么数据？- 修改
ref包裹的变量时，应该怎么写？ - 什么情况下不应该用
computed？
参考答案
ref适合字符串、数字、布尔值等简单值；reactive适合对象或数组。- 通过
.value读写，例如count.value += 1，不能当普通变量直接赋值。 - 会主动修改其他状态的逻辑、依赖异步副作用的场景，应该用函数而不是 computed。
- 简单值用
ref（.value 读写），对象数组用reactive（保持引用稳定） computed声明派生状态，不修改其他值、不做异步副作用- 跨组件共享状态再考虑 Pinia 或 provide/inject