vue input 防抖自定义指令(输入法判断)

 /***
    * 防抖 单位时间只触发最后一次
    *  @param {?Number|300} time - 间隔时间
    *  @param {Function} fn - 执行事件
    *  @param {?String|"click"} event - 事件类型 例:"click"
    *  @param {Array} binding.value - [fn,event,time]
    *  例:刷新
    *  也可简写成:刷新
    *  例:
    */
    Vue.directive('debounce', {
      inserted: function (el, binding) {
        let [fn, event = "click", time = 300] = binding.value
        let timer
        let flag = true;//输入法标记
        if (event === "input") {
          el.addEventListener("compositionstart", () => {
            flag = false;
          })
          el.addEventListener("compositionend", () => {
            flag = true;
          })
        }
        el.addEventListener(event, () => {
            timer && clearTimeout(timer)
            timer = setTimeout(() => {
              if(flag)fn();
            }, time)
        })
      }
    })

你可能感兴趣的:(vue input 防抖自定义指令(输入法判断))