watch 侦听器
watch 侦听器允许开发者监视数据的变化，从而针对数据的变化做特定的操作.
deep 选项
如果 watch 侦听的是一个对象，如果对象中的属性值发生了变化，则无法被监听到。此时需要使 deep 选项
info: {
handler(newVal) {
console.log(newVal)
},
// 开启深度监听，只要对象中任何一个属性变化了，都会触发“对象的侦听器”
deep: true
}
immediate 选项
默认情况下，组件在初次加载完毕后不会调用 watch 侦听器。如果想让 watch 侦听器立即被调用，则需要使 用 immediate 选项
监听对象单个属性的变化
如果只想监听对象中单个属性的变化，则可以按照如下的方式定义 watch 侦听器:
'info.username'(newVal) {
console.log(newVal)
}
计算属性
计算属性指的是通过一系列运算之后，最终得到一个属性值。这个动态计算出来的属性值可以被模板结构或 methods 方法使用.
计算属性的特点
- 虽然计算属性在声明的时候被定义为方法，但是计算属性的本质是一个属性
- 计算属性会缓存计算的结果，只有计算属性依赖的数据变化时，才会重新进行运算
好处：
- 实现了代码的复用
- 只要计算属性中依赖的数据源变化了，则计算属性会自动重新求值！
computed 和 watch 之间的区别：
- computed 能完成的功能，watch 都可以完成。
- watch 能完成的功能，computed 不一定能完成，例如：watch 可以进行异步操作。
两个重要的小原则：
- 所被 Vue 管理的函数，最好写成普通函数，这样 this 的指向才是 vm 或 组件实例对象。
- 所有不被 Vue 所管理的函数（定时器的回调函数、ajax 的回调函数等、Promise 的回调函数），最好写成箭头函数，这样 this 的指向才是 vm 或 组件实例对象。
