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

2021-04-04  本文已影响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,"");
上一篇下一篇

猜你喜欢

热点阅读