Редактирование числа с десятичными числами, как простой текст

Question

Я использую реагирование, и у меня возникла проблема при редактировании числа в простом html вводе TextField для материала-пользователя или даже в текстовой области. Мне нужно, чтобы число отображалось с фиксированным числом цифр, поэтому я использую эту функцию форматирования

toLocaleString(item, precision) {
  if (item != undefined && item != null) {    
    return Number(item).toLocaleString(getNavigatorLanguage(), {
      minimumFractionDigits: precision,
      maximumFractionDigits: precision,
    });
  }
}

Здесь я передаю значение на вход:

<input
  className={classes.NumberField}
  value={toLocaleString(this.state.value, property.getPrecision())}
  style={props.style}
  type="text"
  onChange={this.inputValueChange}
  onKeyDown={this.inputValueChange}
  onBlur={this.inputOnBlur}
 />

и при редактировании, когда курсор помещается справа от последнего знака после запятой, если я ударил пробел, он всегда будет стирать только десятичные дроби и никогда не будет рассматривать целое как обычный текст.

i пытался использовать toFixed (), но я получил то же поведение: вход делится как разделенный на две части: десятичные и недесятичные, как будто есть два ввода вместо одной.

Вот скриншот, показывающий проблему : https://i.imgur.com/hpgg5TU.gifv

Я не думаю, что реакция вызывает это, пытался избавиться от всех обработчиков событий ввода, чтобы сделать его неуправляемым, но это все та же проблема.