watch的基本使用
watch的作用可以监控一个值的变换，并调用因为变化需要执行的方法。可以通过watch动态改变关联的状态
new Vue({
el: '#root',
data: {
name: 'szm'
},
watch: {
name (newName, oldName){
  // 当name的值发生变化时，执行函数语句
// 函数的参数分别为改变后的值和改变前的值
}
}
})
immediate， handler， deep
handler: 当监听数据写成对象格式（需要多个参数）时， handler相当于原来的函数
deep: 深度监听。当监听的数据类型为引用类型（如：数组/对象）时，由于堆内存中的地址并没有改变，无法监听改变，将deep设为true， 即可监听
immediate： 首次绑定立即执行handler方法。watch第一次绑定时不会执行监听函数，若想首次绑定即执行，则将immediate设为true
new Vue({
el: '#root',
data: {
name: 'szm'
},
watch: {
name :{
// 监听的数据后面写成对象形式，handler函数与之前的函数相同
handler(newName, oldName) {
// 当name的值发生变化时，执行函数语句
// 函数的参数分别为改变后的值和改变前的值
},
deep: true
immediate: true
}
}
})
watch的原理
watch 在一开始初始化的时候，会 读取 一遍 监听的数据的值，于是，此时 那个数据就收集到 watch 的 watcher 了 然后 你给 watch 设置的 handler ，watch 会放入 watcher 的更新函数中 当 数据改变时，通知 watch 的 watcher 进行更新，于是 你设置的 handler 就被调用了
当你设置了 immediate 时，就不需要在 数据改变的时候 才会触发。 而是在 初始化 watch 时，在读取了 监听的数据的值 之后，便立即调用一遍你设置的监听回调，然后传入刚读取的值
- 没有设置 deep
因为读取了监听的 data 的属性，watch 的 watcher 被收集在 这个属性的 收集器中
- 设置了 deep
- 因为读取了监听的data 的属性，watch 的 watcher 被收集在 这个属性的 收集器中
- 在读取 data 属性的时候，发现设置了 deep 而且值是一个对象，会递归遍历这个值，把内部所有属性逐个读取一遍，于是 属性和 它的对象值内每一个属性 都会收集到 watch 的 watcher 于是，无论对象嵌套多深的属性，只要改变了，会通知 相应的 watch 的 watcher 去更新，于是 你设置的 watch 回调就被触发了
