计算属性不能处理异步接口返回，因其设计为同步纯函数，依赖响应式数据实时计算并缓存结果；若引入 async/await，则返回 promise 而非实际值，破坏缓存与渲染逻辑；应改用 watch 监听变化并更新 ref，再通过 computed 组合状态。
计算属性不能直接处理异步接口返回，因为它设计上就是同步的——它要依赖响应式数据实时计算、缓存结果，并在依赖变更时立即重算。一旦塞进 async/await 或 Promise，它就不再返回你想要的数据，而是返回一个未决的 Promise 对象，破坏缓存逻辑，也导致模板渲染出错。
计算属性的本质决定它必须同步
Vue 的 computed 是基于响应式依赖构建的“纯函数”：输入确定、输出确定、可缓存、可追踪。它的执行时机由 Vue 的响应式系统调度，不是由你手动触发。如果内部发起网络请求：
- 首次访问时返回的是
Promise，模板里显示[object Promise]或报错 - 后续依赖没变，但接口结果已更新，computed 却不会重新求值（因为没检测到响应式变化）
- 无法统一管理加载态、错误态和完成态，状态碎片化
为什么 watch 可以异步，而 computed 不行？
watch 是副作用监听器，职责是“响应变化后做点事”，它不要求返回值，也不参与模板渲染链路，所以允许你在回调里写 async 函数、调接口、更新 ref —— 它只管执行，不管返回什么。
computed 则是“声明式数据派生”，职责是“提供一个随时可用的响应式值”，这个值必须立刻存在、类型稳定、能被其他响应式逻辑安全消费。
真正可行的替代方案
想实现“依赖变化 → 触发请求 → 更新数据 → 自动反映到视图”，应拆解为标准响应式流程：
- 用
ref或reactive定义承载结果的数据容器（如data = ref(null)、loading = ref(false)、error = ref(null)） - 用
watch监听触发条件（比如搜索关键词、ID 变更），在回调中调用异步函数并更新上述 ref - 模板中直接使用这些 ref，或用另一个
computed基于它们组合状态（例如computed(() => loading.value ? '加载中' : data.value?.name)）
不推荐的“取巧”方式
有人尝试引入第三方插件（如 vue-async-computed）或封装 Promise 实例到 computed 中，短期看似可行，但会带来明显隐患：
- 破坏响应式链路：Promise resolve 后的值不会自动触发视图更新，除非手动
triggerRef - 难以调试：加载、错误、成功状态混杂在一个计算属性里，逻辑耦合度高
- 与 Vue 官方演进脱节：Composition API 明确将异步数据获取交由
watch + async/await或组合式函数（如useAsync类库）承担
