In HTML5 we can do <input type="text" maxlength="3" /> but how do I same in Material-UI ? Bellow is example Material-UI TextFiled ponent

<TextField
          id="name"
          label="Name"
          type="string"
          //maxLength="3" Or maxlength="3" Or max="3"
          margin="normal"
        />

In HTML5 we can do <input type="text" maxlength="3" /> but how do I same in Material-UI ? Bellow is example Material-UI TextFiled ponent

<TextField
          id="name"
          label="Name"
          type="string"
          //maxLength="3" Or maxlength="3" Or max="3"
          margin="normal"
        />

• javascript
• reactjs
• material-ui

• Redux, But I wish they had a simple prop for that. – Sanjay Shr Commented Apr 18, 2018 at 10:33

1 Answer 1

Add the inputProps to the TextField example following:

<TextField
  inputProps={{
    maxLength: 10,
  }}
/>

Or alternative hard coded solution:

<TextField
  onInput={e => {
    e.target.value = Math.max(0, parseInt(e.target.value)).toString().slice(0, 12);
  }}
/>