VUE通过自定义指令，只允许输入大写英文以及数字

在写之前需要知道几个功能对象的作用；

首先输入框输入的情况有键盘输入和粘贴输入的情况

用到的组件有：

          input.onblur-onblur： 事件会在对象失去焦点时发生。Onblur 经常用于Javascript验证代码，一般用于表单输入框。详情

          input.onkeyup：onkeyup 事件会在键盘按键被松开时发生。详情

接着就开始编写vue的自定义指令代码了：

html

<el-input id="valueInput" v-model="value" v-Alphabet placeholder="输入框"></el-input>

 js

import Vue from "vue";
Vue.directive('Alphabet',{
  inserted: function (el) {
            const input = el.querySelector('#valueInput');
            input.onkeyup = function (e) {
                input.value = input.value.replace(/[^A-Z0-9]/g, '')
            }
            input.onblur = function (e) {
                input.value = input.value.replace(/[^A-Z0-9]/g, '')
            }
        }
});

 效果就是输入不符合规则的字符会自动清除。