1、computed - 计算属性
computed 是依赖 Vue 的 options 中的 data 内部属性,计算出一个新的值的,可以当作属性直接用,但是其实为函数。
computed 在使用的过程中不需要加 () 。Vue 会自动去读取其函数的返回值。
computed 会根据依赖进行自动缓存。如果依赖的 data 数据不变,computed 就不会重新计算。
2、watch - 监听
watch 是用来 监听 属性变化的,当属性变化后就会调用 watch 属性内对应的函数。
watch 有一个 immediate 属性,表示是否对 数据第一次渲染 进行监听,执行对应的 watch 函数。
watch 有一个 deep 属性,表示如果要监听一个对象类型的 data 变化时,是否要监听该 data 内部属性的变化。
除了 watch 选项外还可以使用命令式的 vm.$watch,Vue 实例将会在实例化时调用 $watch(),遍历 watch 对象的每一个属性。
3、总结:
1、如果一个数据依赖于其他数据,那么把这个数据设计为 computed 的。
2、如果你需要在某个数据变化时做一些事情,使用 watch 来观察这个数据变化。
3、computed 主要用于对同步数据的处理,watch 则主要用于观测某个值的变化,$nextTick() 可以了解一下。