react--ant.design--InputNumber注意点

属性 precision={2} 可以输入时候保留2位小数。 但是注意。

precision是默认进行四舍五入的。慎用

 <Col span={8}>
                        <Form.Item

                          label="单价"
                          name={[name, 'amount']}
                          rules={[{ required: true, message: '单价最多保留2位小数' }]}
                        >
                          <InputNumber
                            formatter={value => {
                              return (
                                `${value}`
                                  .replace(/\B(?=(\d{3})+(?!\d))/g, "")
                                  .replace(/^(-)*(\d+)\.(\d\d).*$/, "$1$2.$3")
                              )
                            }}
                            addonAfter="元" style={{ width: '100%' }} onChange={handeInput} />
                        </Form.Item></Col>

上面的写法有一个漏洞。就是可以输入负数。正常的单价类型都是大于0的 。所以修正后如下

 <Col span={8}>
                      <Form.Item
                        label="订单报价"
                        name={[name, 'amount']}
                        rules={[
                        { required: true, message: '报价最多保留2位小数' }]}
                      >
                        <InputNumber
                          formatter={value => {
                            return (
                              `${value}`
                              .replace(/[^1-9\d.]/g, '')
                              .replace(/^(-)?0(?!\.)/g, '')
                              .replace(/^(-)*(\d+)\.(\d\d).*$/, "$1$2.$3")
                            )
                          }}
                          addonAfter="元" 
                          controls={false}
                          style={{ width: '100%' }} onChange={handeInput} />
                      </Form.Item></Col>

其他方法仅作参考，未验证

在React中，可以使用InputNumber组件和formatter属性来实现设置value是大于0且最多保留2位小数的数字。 首先，需要引入InputNumber组件，并设置min属性为0，step属性为0.01，这样可以保证输入的值大于0且保留2位小数。

import { InputNumber } from 'antd';
<InputNumber min={0} step={0.01} />

import { InputNumber } from 'antd';
function handleFormatter(value) {
  const reg = /^[0-9]+(\.[0-9]{1,2})?$/; // 正则表达式
  if ((!isNaN(value) && reg.test(value)) || value === '' || value === '-') {
    // 符合要求或为空或为负号
    return `${value}`.replace(/^0*(\d+)\.(\d\d).*$/, "$1.$2");
  } else {
    return '';
  }
}
<InputNumber
  min={0}
  step={0.01}
  formatter={handleFormatter}
  parser={value => value.replace(/[^\d.]/g, '')} // 将非数字和小数点的字符过滤掉
/>