美文网首页
vue设置el-input禁止输入特殊字符,只可输入数字

vue设置el-input禁止输入特殊字符,只可输入数字

作者: 前端阿峰 | 来源:发表于2021-04-04 08:59 被阅读0次

有时候使用Element-ui组件时,根据需求需要设置输入框只能输入数字的效果,我们可以通过下面的代码实现,代码如下:

<template>
    <el-input
        v-model="value"
        placeholder="请输入"
        @keyup.native="keyUp"
        @keydown.native="keydown"
     ></el-input>
</template>
<script>
  export default {
      methods:{
      //限制输入特殊字符
        keyUp(e) {
           e.target.value = e.target.value.replace(/[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]·~!@#¥%……&*()——\-+={}|《》?:“”【】、;‘’,。、]/g,"");
          },
           // 只能输入汉字、英文、数字
        keydown(e) {
           e.target.value = e.target.value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,"");
          }
    }
}
</script>
//只能输入数字
  e.target.value = e.target.value.replace(/[^\d]/g,"");

相关文章

网友评论

      本文标题:vue设置el-input禁止输入特殊字符,只可输入数字

      本文链接:https://www.haomeiwen.com/subject/hephkltx.html