React doesn't render autocomplete off

Question

How do I make react render it?

Answer 1

I solved it with just one line:

If you use the recommended way with "changeHandler()" and the components state, just insert:

changeHandler = (e) => {    
  if (!e.isTrusted) return;
  ... your code
}

More infos on that changeHandler()-Thing:
https://reactjs.org/docs/forms.html#controlled-components

Answer 2

I've also tried many options, but what I ended up doing was to replace the <form> tag with <div> tag and manually manage each input that I had in that form.

Answer 3

In addition to @azium's answer, <input> should be put inside the <form> tag, then autoComplete works

Answer 4

autoComplete="none" - works for me.

Answer 5

None of these solutions really worked on Chrome 80.

After hours of trial and error, this very strange hack worked for me:

1. Add autoComplete="none" to each <input> - Google skips autocomplete="off" now
2. Wrap your fields in a container : <form> or <div>
3. You need at least one valid input field with autoComplete="on". This should be the last element in the container. So I added the following input field to the bottom of my form:

<input 
  type="text" 
  autoComplete="on" 
  value="" 
  style={{display: 'none', opacity: 0, position: 'absolute', left: '-100000px'}} 
  readOnly={true}
/>