在 Vue 框架中，computed 和 watch 这两个选项各自的应用场景与工作机制有哪些不同？

回答思路

1. 【回答框架 1】computed 是计算属性，依赖响应式数据自动计算并缓存结果，只有当依赖发生变化时才重新计算，适合模板中复杂表达式的场景。
2. 【回答框架 2】watch 是侦听器，用于观察数据变化并执行异步或开销较大的操作，例如请求数据、操作 DOM 等。它不会缓存结果，每次数据变化都会触发回调。
3. 【回答框架 3】computed 只能处理同步计算，watch 则可以执行异步逻辑，且能获取变化前后的值。
4. 【回答框架 4】在模板中优先使用 computed，在需要监听数据变化并执行副作用时使用 watch。
5. 【关键点 1】computed 具备缓存机制，只有依赖改变时才会重新求值。
6. 【关键点 2】watch 没有缓存，每次数据变化都会执行回调。
7. 【关键点 3】watch 支持异步操作，computed 不支持。
8. 【关键点 4】watch 可以深度监听对象内部变化，computed 不支持直接深度监听。
9. 【易错点 1】混淆 computed 的缓存特性，以为每次访问都会重新计算。
10. 【易错点 2】在 computed 中执行异步操作，导致 return 失效。
11. 【易错点 3】过度使用 watch 监听深层次对象，可能带来性能问题。