在带有小数的React输入中使用toLocaleString的问题

Question

我有一个要格式化的反应输入框，以便它将显示以货币显示的数字。它当前显示逗号，但是当我尝试添加.（十进制）时，它不起作用。它最多只能显示2个小数位。

在当前设置下，我可以输入2000000，它将被格式化为2,000,000，这是正确的。问题是如果我也想加分，我将无法这样做。因此，2000.50是不可能的。这应该是2,000.50

有一个codesandbox here供参考。如果尝试在其中输入带小数的数字，可能会更清楚。

有人可以在这里帮助吗？

我的代码如下：

function Input() {
  const [value, setValue] = React.useState("");

  const formatValue = value => {
    return setValue(value.replace(/,/g, ""));
  };

  return (
    <input
      type="text"
      value={Number(value).toLocaleString()}
      onChange={e => formatValue(e.target.value)}
    />
  );
}