在Vue 3中,computed和watch都是用于响应式地处理数据变化的工具,但它们有一些重要的异同点。
异同点如下:
计算属性 (Computed):
计算属性是基于它们的依赖进行缓存的。只有在依赖发生变化时,计算属性才会重新计算,可以避免不必要的重复计算。
计算属性适用于派生出一些新的数据,比如对数据进行过滤、排序、格式化等操作。
计算属性可以像普通属性一样使用,而不需要在模板中调用方法。
计算属性中的函数必须有return返回值
监听属性 (Watch):
监听属性允许我们在数据变化时执行异步操作或复杂的逻辑。
监听属性适用于对数据变化做出响应,比如在数据变化时发送请求、处理副作用等。
监听属性可以监听一个或多个数据的变化,并在数据变化时执行相应的操作。
监听属性中的函数不是必须要用return返回值。
相似之处:
计算属性和监听属性都可以依赖于响应式数据。
它们都可以用于监测数据的变化,并作出相应的处理。
原文链接:https://blog.csdn.net/qq_18798149/article/details/135302780
Watch()
当值被改变是提供两个值第一次是因为没有旧值,所以只会有一个新值,当第二次改变时才会有旧值
当监听的是对象时无论怎么改变都没反应,这是因为 Watch 是浅层监听需要监听对象可以开启深层监听有两种方式。
但只需要改变某一个值时推荐使用第一种,当不确定改变多少个值时推荐使用第二种
第一种:普通方法
第二种:开启深层监听
当需要改变多个值时使用:
或者: