在 Vue 中，computed 和 watch 都是用于处理数据变化的工具，但它们在用法和作用上有一些区别。

computed：

属性：computed 是一个计算属性，它的值会被缓存，有依赖的响应式数据发生变化时才会重新计算。 用途：用于基于响应式数据算而来的衍生数据，比如对原始数据进行筛选、排序等操作，或者进行一些复杂的计算。 语法：在 Vue 组件中通过 computed 对象定义算属性，可以在模板中以属性的形式直接使用。 示例：

javascript
computed: {
  fullName() {
    return this.firstName + ' ' + this.lastName;
  }
}

watch：

属性：watch 是一个监听器，用于监听指定的响应式数据，一旦数据发生变化就会执行相应的操作。 用途：用于响应式数据变化后执行异步或开销较大的操作，比如发送网络请求、执行复杂的计算、操作 DOM 等。 语法：在 Vue 组件中通过 watch 对象定义监听器，可以监听一个特定的数据的变化，并指定回调函数。 示例：

javascript
watch: {
  'firstName': function(newVal, oldVal) {
    console.log('firstName 发生变化：', newVal, oldVal);
  }
}

区别总结：

computed 适用于需要进行数据计算、衍生数据的场景，返回的值会被缓存，只在相关响应式数据变化时才会重新计算。 watch 适用于需要执行异步操作或者在数据变化时执行特定操作的场景，常用于监听特定数据的变化，并执行相应代码逻辑。 另外，值得一提的是，Vue 3 中引入了 Composition API，它提供了额外的工具来处理复杂的逻辑，使得对 computed 和 watch 的使用更加灵活和便捷。

追问：watch 和 computed 内都能写异步吗

在Vue中，watch和computed都是用来监视数据变化并执行相应操作的功能，但它们的使用方式和处理异步操作的能力是不同的。

在watch中，你是可以观察任何数据变化，并且可以执行异步操作。你可以在watch的handler函数中使用异步代码，例如发起一个异步请求或者执行一个异步操作。

在computed中，通常情况下是不能直接写异步操作的，因为computed是一个同步的计算属性，它的计算结果会被缓存并且只有在相关响应式依赖发生变化时才会重新计算。如果你需要在computed中执行异步操作，你可以通过使用async/await或者返回一个Promise来实现异步计算，但是这样会让computed失去了一些性能上的优势，因为它将无法立即获得计算结果。

总的来说，watch更适合处理数据变化的副作用和异步操作，而computed更适合处理基于响应式数据计算的需求。