onkeyup事件导致输入框内容显示有误 （对于Windows输入法）

项目场景：

对输入框限制输入内容 有些特殊符号转化为空格 

---

问题描述

今天同事发现他用最原始的windows输入法去输入内容时 框内把内容的拼音也带上了 ，原来使用的方法是这个：

onkeyup="value=value.replace(/([^0-9A-z\u4e00-\u9fa5]|[\^\_\]\[`])/g,' ').replace(/( )+/g,'')"

原因分析：

这个方法在输入中文内容时，表单校验会不通过。 输入的内容变成新的变量了，但是表单校验监听不到这个新变量，输入框内展示的内容就会是错误的

---

解决方案：

后来面向百度，找到了解决办法： 使用input事件 将新填入的变量进行正则校验后 再赋值给input输入框绑定的变量，这样就能监听到这个替换后的变量

//标签上绑定的input事件
@input="showInpKey(form[field.FIELDNAME + '-' + field.TYPE], field)"


//方法
showInpKey(value, field) {
    const reg = /([^0-9A-z\u4e00-\u9fa5]|[\^\_\]\[`])/g; // 匹配非数字、字母、汉字
    if(reg.test(value)){
        value = value.replace(reg, ' ');
     }

     this.form[field.FIELDNAME + '-' + field.TYPE] = value.replace(/( )+/g, ' '); //输入多个空格也只展示一个空格
 },

今年的班就先上到这里咯 ，明年在上！