一、前言
前端项目是react，使用了antd，需要一个数字输入框，只允许输入数字。
二、代码样例
import { Form, InputNumber } from 'antd';const FormItem = Form.Item;const formItemLayout = {labelCol: {xs: { span: 24 },sm: { span: 8 },},wrapperCol: {xs: { span: 24 },sm: { span: 16 },},
};
=============================//只允许整数limitDecimalsP = (value) => {let reg = /^(\d+).*$/;if(reg.test(value)){return String(value).replace(reg, '$1')}else{return ''}}=============================<Form {...formItemLayout} onSubmit={this.handleSearch} layout="inline"><FormItem label={'测试数字框'}>{getFieldDecorator('id', {initialValue: null,})(<InputNumberplaceholder={'请输入数字'}allowClearautoComplete="off"style={{ width: '100%' }}step={1}min={0}formatter={this.limitDecimalsP}parser={this.limitDecimalsP}/>)}</FormItem>......
</Form>1.这是一个表单输入框，其中，表单的提交方法是this.handleSearch(这里省略)
2.表单的样式是formItemLayout
3.这个数字输入框的key是getFieldDecorator('id',里的id，value就是自己输入的内容
4. step={1} min={0}的意思是，数字输入框的最小值是0，点击输入框右边的增加/减少按钮，一次增减1
5. formatter={this.limitDecimalsP} parser={this.limitDecimalsP}就是限制表单输入内容的方法
6.limitDecimalsP 方法中，使用了正则表达式/^(\d+).*$/，实现的效果是：
(1)当表单为空，无法输入整数以外的内容
(2)当表单存在数字，无法在数字末尾输入整数以外的内容
(3)当表单存在数字，如果在某个数字前尝试输入数字以外的内容，则从光标开始后的所有内容会被替换为空
