vue移动端 利用防抖的原理 ---实现搜索页面防抖操作

效果目标：搜索页面防抖操作

防抖：

• 原理：在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时。
• 适用场景：
  • 按钮提交场景：防止多次提交按钮，只执行最后提交的一次
  • 搜索框联想场景：防止联想发送请求，只发送最后一次输入

此次应用于搜索框防抖操作：

1. 在 搜索组件 ---输入框绑定一个事件

 2.在data 里设置一个防抖的定时器，timer:null

 3.在methods 里进行 改变触发事件， 用clearTimeout清楚上次的---->setTimeout 设置延迟

methods:{
  //输入框-内容实时改变触发事件方法
  inputFn(){
    clearTimeout(this.timer)//清除上一次的
//防抖： 延时执行逻辑代码,事件再次触发时，清楚上一个定时器
this.timer= setTimeout(()=>{
  if(this.kw.length===0) return console.log(this.kw)

},300)
  }
}