vue3 输入框禁止输入表情

 .js

// 禁止输入表情包
export const includeSpecial = (value) => {// eslint-disable-next-lineconst 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/givalue.value = value.value ? value.value.replace(regStr, '') : ''
}

.vue   使用

<template><div class="form_search"><el-form class='form_flex' :inline="true" size="mini" :model="searchParam" ref="searchForm" label-width="100px"><div class='form_flex_item'><div><el-form-item label="手机号"><el-input v-model="searchParam.userPhone" placeholder='请输入' clearable @input="includeSpecial(toRef(searchParam, 'userPhone'))"></el-input></el-form-item></div><div><el-form-item label="用户姓名"><el-input v-model="searchParam.userName" placeholder='请输入' clearable @input="includeSpecial(toRef(searchParam, 'userName'))"></el-input></el-form-item></div><div><el-form-item><el-button type="primary" name='search_search' @click="handleSubmit" icon="el-icon-search">查询</el-button></el-form-item></div></div></el-form></div>
</template><script>
import { defineComponent, reactive, toRef } from 'vue'
import { includeSpecial } from '@/utils/utils.js'
export default defineComponent({setup (props, { emit }) {const searchParam = reactive({ userName: '', userPhone: '' })const handleSubmit = () => {emit('submit', searchParam)}return {handleSubmit,searchParam,includeSpecial,toRef}}
})
</script>