【vue学习】computed & watch

https://segmentfault.com/q/1010000009263244/

①从属性名上,computed是计算属性,也就是依赖其它的属性计算所得出最后的值。watch是去监听一个值的变化,然后执行相对应的函数。
②从实现上,computed的值在getter执行后是会缓存的,只有在它依赖的属性值改变之后,下一次获取computed的值时才会重新调用对应的getter来计算。watch在每次监听的值变化时,都会执行回调。其实从这一点来看,都是在依赖的值变化之后,去执行回调。很多功能本来就很多属性都可以用,只不过有更适合的。如果一个值依赖多个属性(多对一),用computed肯定是更加方便的。如果一个值变化后会引起一系列操作,或者一个值变化会引起一系列值的变化(一对多),用watch更加方便一些。
watch的回调里面会传入监听属性的新旧值,通过这两个值可以做一些特定的操作。computed通常就是简单的计算。
watchcomputed并没有哪个更底层,watch内部调用的是vm.$watch,它们的共同之处就是每个定义的属性都单独建立了一个Watcher对象。


computed是用于定义基于数据之上的数据。

watch是你想在某个数据变化时做一些事情,如果做的事情是更新其他数据,那其实与把这个要更新的数据项定义成computed是一样的,这个时候用computed更有可读性,虽然技术上讲watch也可以实现。

但你也可以在被watch的数据变化时做其他事情啊,比如调用一个方法,这个是computed做不到也不应该做的。


computed其实只是纯数据操作,需要返回数据结果。
但是watch就可以监测某个数据发生了变更进行一系列的回调操作,不仅仅局限于返回数据,你也可以不返回


computed会产生新的属性,产生的新的属性与data中原有的属性功能没有区别.用法一样;watch不会产生新的属性.
computed会在vue实例化过程中执行一次(前提是这个计算属性在template有用到,如果没有用到,这个 computed永远不会执行,包括vue初始化时);watchvue初始化时不会执行.
开发时选用哪一个:想得到某个属性变化时产生的结果用computed.某个属性变化时产生的影响用watch
一个侧重结果(值),一个侧重影响(过程).

你可能感兴趣的:(【vue学习】computed & watch)