watch 和 computed 区别

watch 和 computed 区别
在Vue.js中，watch和computed是用于响应式地监听数据变化的两种不同的方式。

1. 用途不同：
   watch用于监听特定的数据变化，并执行相应的操作。可以监听单个或多个数据的变化，可以进行异步操作，也可以在数据变化时执行复杂的逻辑。
   computed用于计算衍生的数据。它基于响应式数据进行计算，只有依赖的数据发生变化时，才会重新计算。computed属性通常用于需要经过计算得出的数据，如过滤、排序、格式化等。

2. 响应方式不同：
   watch是一种基于回调的方式，可以监听数据的变化，并在变化时执行回调函数。可以通过handler选项或使用带有immediate选项的watch来立即执行回调函数，也可以使用deep选项来深度监听嵌套对象的变化。
   computed是一种基于依赖追踪的方式，它会自动追踪依赖的数据，并在依赖数据发生变化时进行更新。每次访问computed属性时，如果依赖数据没有变化，则会直接返回缓存的计算结果，而不会重新计算。

3. 语法和用法不同：
   watch可以使用$watch方法进行声明式的数据监听，也可以在组件的选项中使用watch属性进行声明式的数据监听。watch的回调函数接收两个参数：新值和旧值。
   computed使用computed选项或计算属性的方式进行声明。computed属性是一个函数，返回计算后的值，不接收参数。

4. 使用场景不同：
   watch适用于需要监听数据的变化，并执行一些副作用操作的场景，如异步请求、监听输入框变化、监听路由参数变化等。 computed适用于需要根据数据进行计算得出结果的场景，如根据列表数据计算总数、根据筛选条件过滤数据等。
   总的来说，watch适用于监听数据变化并执行副作用操作，而computed适用于计算衍生数据。两者可以互补使用，根据具体需求选择合适的方式来实现响应式的数据监听和计算