防抖的使用场景：

• 登录或者发短信避免用户点击过快，以至于发送了太多请求，需要防抖
• 调整浏览器窗口大小时，resize次数太过频繁造成计算过多，需要一次到位，就用到了防抖
• input框搜索时候，当触发input框事件的时候每次输入内容都会刷新（清除上一个定时器），也就是说只要你一直输入内容他就会一直不请求

防抖的原理：

• 在事件被触发n秒后在执行回调，如果在这n秒又被触发，则重新计时

实现思路：

 实现防抖：

1. 在根目录下创建utils文件夹，在utils文件夹下创建一个utils.js文件
2. 在utils.js下添加代码

   export function debounce(fn, wait) {
       let timeout = null;
       wait = wait || 600;
       return function () {
         let that = this;
         if(timeout !== null)   clearTimeout(timeout);  
         timeout = setTimeout(() => {
           fn.apply(that);
         }, wait);
       }    
   }

3. 在需要的页面引入

   //在需要的页面引入
   import {debounce} from "@/utils/utils"

4. 触发input事件

    <input v-model="value" @input="changeValue" />

5. 调用changeValue方法

   methods:{
       changeValue:debounce(function(){
        console.log(111)
       }, 1000)  //这个1000代表事件延迟1000ms执行
   }