加工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