防抖debounce中timestamp取得值为当时按下的时间，如何实现最后一次按下之后再执行

Question

我在数字1中加入了防抖去触发’和‘

    watch: {
        num1(newValue) {
            this.debounce(this.changeSum1, 500)()
        }
    },

每次按下时的timestamp的值都是我按下按键的时间，这种情况无论500毫秒后我是否输入完成都会触发时间

我必须把timestamp设置成全局的变量，使用this.timestamp才能实现输入完成后500毫秒之后再执行

debounce = function(func, wait, immediate) {
  var timeout, args, context, timestamp, result;
  var later = function() {
    var last = _.now() - timestamp;
    if (last < wait && last >= 0) {
      timeout = setTimeout(later, wait - last);
    } else {
      timeout = null;
      if (!immediate) {
        result = func.apply(context, args);
        if (!timeout) context = args = null;
      }
    }
  };
  return function() {
    context = this;
    args = arguments;
    timestamp = _.now();
    var callNow = immediate && !timeout;
    if (!timeout) timeout = setTimeout(later, wait);
    if (callNow) {
      result = func.apply(context, args);
      context = args = null;
    }
    return result;
  };
}

Answer 1

在vue中他每个组件都是一个独立的，所以你要把防抖封装起来使用
定一个一个util.js文件写防抖

//**********************防抖************************//
let timeout = null
let debounce = function(fn, wait) {
  if(timeout !== null) clearTimeout(timeout)
  timeout = setTimeout(fn, wait)
}
//**********************防抖************************//
module.exports = {
    debounce:debounce
};

在需要使用的地方使用

import {debounce} from "util.js"
debounce(()=>{
  代码块
},1000)