Home > Mobile >  Unable to change decimal value in MUI v5 TextField
Unable to change decimal value in MUI v5 TextField

Time:10-28

I tried to display decimal value 1.0 in the MUI5's TextField component. I'm able to change its value only with the icons in the TextField but not when I try to input any value. Backspace does not seem to work.

Excerpt from my code

export default function App() {
  const [value, setValue] = useState(1);
  const handleChange = (e) => {
    setValue(e.target.value);
  };
  return (
    <div className="App">
      <TextField
        fullWidth
        variant="outlined"
        id="value"
        name="value"
        type="number"
        label="Decimal Value"
        value={parseFloat(value).toFixed(1)}
        onChange={handleChange}
      />
    </div>
  );
}

I created a working example using Codesandbox Demo

  • Related