在开发的功能交付测试的时候,测试提出来文本框不能输入表情的bug(这也算一个bug?哪位大神会进行这样的反人类操作啊),说归说,既然提出来了,那咱还得改不是,具体代码如下所示:

  1. 首先声明一个输入框:
<a-form-item label="" name="searchValue">
      <a-input v-model:value.trim="formState.searchValue" autocomplete="off" placeholder="请输入姓名或工号" @change="checkValue" allowClear></a-input>
</a-form-item>
  1. 定义输入框失去焦点的方法,在该方法里使用正则表达式
// 检查输入框内容是否包含特殊符号
        const checkValue = () => {
            const regStr = /[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\uA9|\uAE|\u3030/gi
            // 获取输入的最后一个字符
            let temp = state.formState.searchValue.charAt(state.formState.searchValue.length - 1)
            console.log(temp)
            // 对其进行正则校验
            temp = temp ? temp.replace(regStr, '') : ''
            // 把输入框的值的最后一个值由temp替代
            state.formState.searchValue = state.formState.searchValue.replace(state.formState.searchValue.charAt(state.formState.searchValue.length - 1), temp)
 

获取到输入框每次输入的最后一个字符,然后判断该字符是表情还是正常输入的字符,如果是表情的话就替换成空字符串,然后在赋值给输入框双向绑定的值。

当然,上面的正则表达式中只包含了部分表情,比如♥这样的表情是不能输入的,但由于有些表情(😊)暂时没找到对应的代码,所以目前没有过滤到,以后遇到了会进行更新。

在开发的功能交付测试的时候,测试提出来文本框不能输入表情的bug(这也算一个bug?哪位大神会进行这样的反人类操作啊),说归说,既然提出来了,那咱还得改不是,具体代码如下所示:首先声明一个输入框:&lt;a-form-item label="" name="searchValue"&gt; &lt;a-input v-model:value.trim="formState.searchValue" autocomplete="off" placeholder="请输入姓名或工号" @ch
项目中测试提出问题,在Input输入框输入表情后,后台会报错,于是想着在前端输入的时候禁止输入表情,或者点击win10输入法后面的表情时,禁止输入表情 在网上看到一些方法,参考地址,可以实现实现输入的时候不能输入表情,但是鼠标点击win10输入框后面的表情时,还是能输入的。 所以我对以上方法做了一点改造,实现了我想要的效果,如下图所示
输入框禁止输入表情符号,在这里记录一下 <el-input v-model="inputValue" @input="inputVal('inputValue',$event)"></el-input> methods中的方法 // 禁止input框输入表情 inputVal(type,e){ console.log(type,e,'--------') let reg = /([0-9|*|#]\uFE0F\u20E3)|([
后台管理项目input输入框不可以输入表情代码实现如下 <el-input @input="prodDetail.prodName = prodDetail.prodName.replace(reg, '')" v-model.trim="prodDetail.prodName" clearable ></el-input> data(){ return { reg: /[\uD83C|\uD83D|\uD83E][\uDC00-
最近项目中有一个需求,所有的文本输入框需要过滤掉表情符号,但是觉得每次表单验证的时候去判断,有点麻烦。于是我想到了自定义一个指令,后续遇到需要删除表情符号的输入框,直接通过指令将表情符号删除就好了,方便快捷! 一、首先看看Vue自定义指令文档 https://cn.vuejs.org/v2/guide/custom-directive.html 二、在项目的directive中自定义一个指令...
EditText输入框禁止输入Emoji表情符EditText输入框禁止输入Emoji表情符,要想做到这样的效果,就要通过添加EditText的addTextChangedListener()监听来过滤Emoji表情:onTextChanged() beforeTextChanged()/**
我就废话不多说了,大家还是直接看代码吧~ <Input v-model=”relatedWords” type=”textarea” placeholder=”请输入” @input=’verifyInput(formItem.relatedWords)’/> verifyInput(v){ let _this=this; let punctuation = /[`~!@#$%^&*_\-=<>?:"{}|.\/;'\\[\]·~!@#¥%……&——\-={}|《》?:“”【】、;‘'。、]/im; let arr=v.split('') let str='' 再点前面的绿色箭头,让他跑起来,下面出现结果(尽量用英文) public class Hello { public static void main(String[] args) { System.out.println(“Hello,world!”); Jenkins 构建前端代码失败,报错:The package “esbuild-linux-64“ could not be found, and is needed byesbuild 名字也要认真对待: 怎么运行命令升级啊 chatGPT 加入候补名单时,提示:Oops! We ran into an issue while authenticating you. Anita130: 大佬私信求救啊表情包 chatGPT 加入候补名单时,提示:Oops! We ran into an issue while authenticating you. Zhao02468: cmd 窗口、记事本打开后一片空白且几秒钟后闪退的问题解决方案汇总 小刘加油!: 使用管理员身份打开cmd窗口