Vue自定义指令实现 input框只允许输入正整数，自定义防重点击

一、只能输入正整数 1.首先vue+elementUI是我最常用的后管搭建模式，其中el-input type="number"得模式下可以限制输入框只能输入数字，但是某种特定情况下，需要输入正整数，这时，就需要来个自定义指令来实现这种需求。

2.想要全局使用自定义指令，需要在main.js中挂载：

根据keypress事件，监视键盘keyCode码，结合数字正则表达式 判断键入的keyCode是否是数字，如果非数字则调用preventDefault事件阻止默认行为，只能输入0~9（不知道当时看的哪个大牛得，哈哈哈）

3.在需要使用得el-input处 使用指令 v-enter-number（注意须在结尾处使用，我也不知道为啥，哈哈哈）

二、全局自定义防重

// 核心代码
    Vue.directive('preventReClick', {
        inserted (el, binding) {
        el.addEventListener('click', () => {
          if (!el.disabled) {
            el.disabled = true
            setTimeout(() => {
              el.disabled = false
            }, binding.value || 2000)
          }
        })
      }
    })
    //挂载
    
    <div class="btnsBox" v-preventReClick="3000" @click.prevent="btnClick($event, 1)">
      确定
    </div>
    
    // 使用事件
    btnClick(event){
      if (event.target.disabled) {
        return false
      }
      //3秒防重点击
    }

搞定！！！