VUE中computed与watch属性

computed

computed 是计算属性，它会根据你所依赖的数据动态显示新的计算结果。计算属性将被加入到 Vue 实例中，所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例通过计算出来的属性不需要调用直接可以在 DOM 里使用

computed用来监控自己定义的变量，该变量不在data里面声明，直接在computed里面定义，然后就可以在页面上进行双向数据绑定展示出结果或者用作其他处理

watch

一个对象，键是 data 对应的数据，值是对应的回调函数。值也可以是方法名，或者包含选项的对象，当 data 的数据发生变化时，就会发生一个回调，他有两个参数，一个 val （修改后的 data 数据），一个 oldVal（原来的 data 数据）

watch主要用于监控vue实例的变化，它监控的变量当然必须在data里面声明才可以，它可以监控一个变量，也可以是一个对象，但是我们不能监视对象的单一属性，要监听整个队形

Vue 实例将会在实例化时调用$watch()，遍历 watch 对象的每一个属性

• deep 控制是否要看这个对象里面的属性变化
• immediate 控制是否在第一次渲染是执行这个函数

 

总结：

如果一个数据需要多个数据经过复杂计算就用 computed     可用于快速计算视图（View）中显示的属性。这些计算将被缓存，并且只在需要时更新。

如果一个数据需要被监听并且改变时需要对数据做一些操作就用 watch     一般用于监控路由、input输入框的值特殊处理等等，它比较适合的场景是一个数据影响多个数据

------------恢复内容结束------------