Console warning with Material UI React TextField: "React does not recognize the `InputProps` prop on a DOM element"

Viewed 471
index.js:1 Warning: React does not recognize the `InputProps` prop on a DOM element.
If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `inputprops` instead.
If you accidentally passed it from a parent component, remove it from the DOM element
<form onSubmit={(e) => onSubmit(e)} style={{ margin: "0.5em" }}>
  <Grid container>
    <Grid item xs={6}>
      <TextField
        InputProps={{ disableUnderline: true }}
        name="USERNAME"
        id="USERNAME"
        value={USERNAME}
        label="username"
        error
        helperText={error.USERNAME}
        onChange={(e) => onInputChange(e)}
      />{" "}
      <br />
      <TextField
        InputProps={{ disableUnderline: true }}
        type="text"
        name="FIRSTNAME"
        label="firstname"
        value={FIRSTNAME}
        onChange={(e) => onInputChange(e)}
        error
        helperText={error.FIRSTNAME}
      />{" "}
      <br />
      <TextField
        InputProps={{ disableUnderline: true }}
        type="text"
        name="LASTNAME"
        value={LASTNAME}
        label="lastname"
        onChange={(e) => onInputChange(e)}
        error
        helperText={error.LASTNAME}
      />{" "}
      <br />
      <TextField
        InputProps={{ disableUnderline: true }}
        type="text"
        name="PHONE"
        value={PHONE}
        label="phone"
        onChange={(e) => onInputChange(e)}
        error
        helperText={error.PHONE}
      />{" "}
      <br />
      <TextField
        InputProps={{ disableUnderline: true }}
        id="EMAIL"
        name="EMAIL"
        value={EMAIL}
        label="email"
        onChange={(e) => onInputChange(e)}
        error
        helperText={error.EMAIL}
      />{" "}


      // ...
    </Grid>
  </Grid>
</form>

Why does React think the InputProps prop will be added to the DOM as an attribute?

0 Answers
Related