As mui docs says:

By default, the component disables the input autocomplete feature (remembering what the user has typed for a given field in a previous session) with the autoComplete="off" attribute.

So code would look like this:

<TextField
  {...params}
  inputProps={{
    ...params.inputProps,
    autoComplete: 'off',
  }}
/>

Error got resolved! I figured out the reason for getting this error, that was a different use case. I have an update password form next to the contact info form and that update password form has three fields:

• Current password
• New password
• Confirm password

So, what was happening is that the current password field got auto-filled with a password saved in the browser because the type of that field is 'password' and the zip code field was just above this current password field so it got filled with the email of the saved password.

What I needed to do was to turn off the autocomplete for the password field so that the autocomplete of the zip code field with an email address would stop too. I tried the following options to stop password autocomplete but didn't work:

- autoComplete="nope"

- autoComplete="off"

- inputProps = {{
     autoComplete: "off"
}}

- inputProps = {{
     autoComplete: "nope"
}}

what actually worked is:

inputProps={{
     autoComplete: 'new-password'
}}

By doing this, my zip code field's auto-completing with email address (that was so strange to understand) got off too.

Thank you guys who posted answers for your help, your answers were correct but I had a completely different use case that's why no solution was working!

I suspect the problem with your ZIP code field is that autocomplete is autoComplete?: string | undefined; so it might not work with numbers.

edit: I see it gets autocompleted with your email. Try adding this:

    <Textfield
        name="zipCode"
        id="zipCode"
        label="Zipcode *"
        inputProps={{ autoComplete: 'off' }}
        value={addressDetails.zipCode || ""}
        onChange={updateAddressDetails}
        error={displayError(validationErrors?.zipCode)}
        helperText={validationErrors?.zipCode}
        fullWidth
    />