1.概念

在vue框架中wathch监听函数 主要监听数值的变化 监听对象可以是一个变量也可以是一个对象 本次是监听文本框中内容的变化，监听的是一个value:’'中的值的变化

2.使用方法

在watch函数中使用
（1） value(){} 形式来监听value的变化 但是value从值a=>b的时候可以触发监听 从初始的undefined=>a是不能监听的
（2） value：{
handler:fn(value){
console.log(value)
},
deep:true,
immediate: true
}
这种形式会从value初始没有值为undefined的时候开始监听 每次变化都会立马侦听 然后触发value中的handle函数中的fn函数 handler函数名是固定的
immediate: true—//该回调将会在侦听开始之后被立即调用
deep:true—//监听的是对象，而且层级比较深的时候使用 监听较深层级中的数据的变化 形如 下边a对象中监听c数据的变化
a: {
b: {
c: 1
}
}

3.相关代码

黑马面面中search搜索联想中使用的监听

 watch: {
    // 从值a => b
    // undefined => 1
    // 1 => 2 => 3
    // {
    //   a: {
    //     b: {
    //       c: 1
    //     }
    //   }
    // }
    // abc() {}, //普通的值
    searchText: {
      // 当searchText发生变化的时候就会调用handler函数
      // 注意：handler函数名称是固定的
      //   handler(value) {
      //     this.loadSearchSuggestions(value);
      //   },

      // debounce(参数1，参数2)防抖函数
      // 参数1：延迟时间，单位是毫秒
      // 参数2：防抖之后的函数
      handler: debounce(function(value) {
        this.loadSearchSuggestions(value);
      }, 300),
      immediate: true //该回调将会在侦听开始之后被立即调用
    }
  }