#Vue3 computed 属性依赖总结

#1. 依赖收集机制

• computed 的 getter 内部 读取 到哪些响应式变量 (ref / reactive)，就会把这些变量收集为依赖。
• 当这些依赖发生变化时，computed 会重新计算。

#2. 如果只返回常量

复制const a = ref(1)
const b = ref(2)

const c = computed(() => {
  return 100 // 没有访问 a、b
})

• c.value 始终是 100。
• 修改 a 或 b 不会触发 c 重新计算，因为 getter 内没有访问它们。

#3. 如果访问了响应式变量但仍返回常量

复制const c = computed(() => {
  console.log(a.value, b.value) // 虽然只是打印
  return 100
})

• 初始化时会打印一次。
• 当 a 或 b 改变时，getter 会重新执行（再次打印），因为它们被收集为依赖。
• 但 c.value 依旧始终是 100。

#4. 总结

• 是否触发重新计算，取决于 getter 内是否访问了响应式变量。
• 最终返回值是否变化，取决于 return 的表达式。
  • 没有依赖 → 不会重新计算。
  • 有依赖但 return 常量 → 会重新计算，但值不变。
  • 有依赖且 return 表达式依赖变量 → 会重新计算且值会变。