Enjoy the good life everyday!
关闭
欢迎来PyGo个人空间 ^_^
VUE之input只允许输入数字 | PyGo²

VUE之input只允许输入数字

加工INPUT标签,只允许输入数字

VUE INPUT

在写前端代码的时候,经常会遇到手机号的input输入框,除了位数限制,还有数字等判断,对input进行加工,满足纯数字输入:

方式一:
直接用oninput事件处理输入的内容,正则匹配内容

1
2
3
4
5
6
7
8
9
10
11
<el-input
v-model.trim="formData.start"
placeholder="文档转换的起始页码,默认首页开始"
:size="inputAttrs.size"
:maxlength="formDataLimit.start"
:clearable="inputAttrs.clear"
:show-word-limit="inputAttrs.limit"
:prefix-icon="inputAttrs.prefixIcon"
:disabled="!formData.mode"
oninput="this.value=this.value.replace(/[^\d]/g,'');"
/>

方式二:
直接使用Element-UI的el-input-number组件。

1
<el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>

END
  • 本文作者:mingliang.gao【一个爱老婆Python程序猿。。。。。。】
  • 本文链接: http://pygo2.top/articles/18893/
  • 版权声明: 本博客所有文章欢迎转载,转载请注明出处!
觉得有帮助 请偶坐个公交车
0%