Проблема с использованием toLocaleString в вводе React с десятичными знаками

Question

У меня есть поле ввода реакции, которое я хочу отформатировать, чтобы оно отображало число, отображаемое в валюте.В настоящее время он показывает запятые, но когда я пытаюсь добавить . (десятичное число), это не работает.Должно отображаться только до 2 десятичных знаков.

При текущей настройке я могу ввести 2000000, и она будет отформатирована как 2,000,000, что правильно.Проблема в том, что если я хочу добавить центы, я не могу этого сделать.Так что сделать 2000.50 невозможно.Это должно быть 2,000.50

. Здесь для справки есть коды и .Это может быть понятнее, если вы попытаетесь ввести сумму с десятичными числами там.

Может кто-нибудь помочь здесь?

Мой код выглядит так:

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)}
    />
  );
}