如何使用 Ant Design 将输入数字限制为最多两位小数？

Posted 2023-03-07

【中文标题】如何使用 Ant Design 将输入数字限制为最多两位小数？

【英文标题】：How to limit the input number to max of two decimals with Ant Design?

【发布时间】：2020-03-15 13:10:13

【问题描述】：

例如53.23 或 20.15 但不超过 2 位小数。 想知道是否有针对此的 Ant Design API。

<InputNumber
  defaultValue=10
  style= width: '30%', marginLeft: 28 
  name="quantity"
/>

【参考方案1】：

没有这样的API，主要原因可能是认为“格式化为十进制”（你应该将数字四舍五入到最接近的小数点吗？你应该把它切成字符串吗？），所以开发人员必须手动决定如何处理：

const twoPointDecimal = number => Number(number).toFixed(2);

const App = () => 
  const [value, setValue] = useState(42.54);

  const onChange = number => setValue(twoPointDecimal(number));

  return (
    <FlexBox>
      <InputNumber
        value=value
        onChange=onChange
        defaultValue=10
        style= width: '30%', marginLeft: 28 
        name="quantity"
      />
    </FlexBox>
  );
;

【参考方案2】：

您只需要在 InputNumber 中使用precision 或math.round

<InputNumber
     placeholder='Value'
     onChange=(value) => provideFunctionValue(value)
     min=1
     precision=2
     step=0.1
     max=10
/>

您还应该使用toFIxed(2) 尝试上述答案，但这在我的情况下不起作用。