十、watch监视属性

（一）监视属性

• 当被监视的属性变化时，回调函数自动调用，进行相关操作
• 监视的属性必须存在，才能进行监视

1.监视的两种写法

1）new Vue 时传入 watch 配置

• 创建 Vue 实例时已经明确需要监视什么属性

2）通过 vm.$watch 监视

• Vue 实例挂载后通过某种行为需要监视某些属性

（二）深度监视

• Vue 中的 watch 默认不监测对象内部值的改变（一层）
• 配置 deep: true 可以监测对象内部值的改变（多层）

提示

• Vue 自身可以监测对象内部值的改变，但 Vue 提供的 watch 默认不可以
• 使用 watch 时根据数据的具体结构，决定是否采用深度监视

（三）computed 和 watch 的区别

• computed 能完成的功能，watch 都可以完成
• watch 能完成的功能，computed 不一定能完成
  • 如：watch 可以进行异步操作

（四）两个重要的小原则

• 所有被 Vue 管理的函数，最好写成普通函数
  • 这样 this 的指向才是 vm 或 组件实例对象
• 所有不被 Vue 管理的函数（定时器的回调函数、Ajax 的回调函数、Promise 的回调函数等），最好写成箭头函数
  • 这样 this 的指向才是 vm 或 组件实例对象