watch监听

普通监听

<input type="text" v-model="userName"/>  
//监听   当userName值发生变化时触发
watch: {
    userName (newName, oldName) {
        console.log(newName)
    }
}

• immediate 属于watch自带的一个参数

第一种有一个缺点 就是当值第一次绑定的时候 不会执行监听函数，
只有当值改变的时候 才会执行，如果想在第一次绑定的时候执行此监听函数 则需要 设置
immediate 为 true

<input type="text" v-model="userName"/>  
watch: {
    userName: {
        handler (newName, oldName) {
            console.log(newName)
        },
        immediate: true
    }
}

• 深度监听 当要监听对象或数组的时候需要添加deep: true属性

  <input type="text" v-model="cityName.name" />
  data (){
      return {
          cityName: {name:'北京'}
      }
  },
  watch: {
      cityName: {
          handler(newName, oldName) {
              console.log(newName)
          },
          immediate: true,
          deep: true
      }
  }