输入防抖 vue # 输入搜索的时候 及时搜索的快速访问接口的 解决方案 vue 中使用防抖和节流

输入防抖

 

watch: {
    value (newVal, oldVal) {
      if (this.timer) {
        clearTimeout(this.timer)
      }
      this.timer = setTimeout(() => {
        // console.info('text')
        this.getTableData(newVal)
      }, 500)
    }
  },

 

 ```

methods: {

    debounceByAc (ctx, next) {

      if (this.debounceTimer) {

        clearTimeout(this.debounceTimer)

      }

      this.debounceTimer = setTimeout(() => {

        next()

      }, 300)

    },

```

 

下面那个 经过测试不好用自己从写了个上面的

https://blog.csdn.net/qq_39759115/article/details/82287517

// 防抖
export function _debounce(fn, delay) {

    var delay = delay || 200;
    var timer;
    return function () {
        var th = this;
        var args = arguments;
        if (timer) {
            clearTimeout(timer);
        }
        timer = setTimeout(function () {
            timer = null;
            fn.apply(th, args);
        }, delay);
    };
}
// 节流
export function _throttle(fn, interval) {
    var last;
    var timer;
    var interval = interval || 200;
    return function () {
        var th = this;
        var args = arguments;
        var now = +new Date();
        if (last && now - last < interval) {
            clearTimeout(timer);
            timer = setTimeout(function () {
                last = now;
                fn.apply(th, args);
            }, interval);
        } else {
            last = now;
            fn.apply(th, args);
        }
    }
}