Disable chrome auto complete feature in React JS

问题

Friends,

We want to disable auto-complete in Chrome browser in our React JS application. We have tried bunch of solution available on the internet but nothing worked. autoComplete=off is not reliable and so are other ways.

This is really important for us at this moment so can you please suggest us a foolproof way to disable autocomplete in Chrome using React js?

Secondly, we are using a common control/component for our text boxes and using them everywhere

回答1:

Do autocomplete="new-password" to disable autocomplete.

回答2:

I got the same issue with my React project. My solution is to use a random string for autoComplete attribute. Don't use "off", as per Pim, you need to set a invalid value to really turn auto completion off. Please also note the attribute name has to be autoComplete in React.

回答3:

The only hack that worked for me is to create hidden input and add random number for the original input name:

<input type="text" name="" value="" readOnly={true} style={{display: "none"}}/>
<input
  type="text"
  name={"address " + Math.random()}
/>

回答4:

You can override chrome autofill by add onFocus attribute.

render()
{
  return <input type="text" name="name" value="this is my input" autoComplete="off" onFocus={this.onFocus} />
}

In the onFocus method we need to change "autocomplete" attribute through javaScript.

onFocus = event => {

   if(event.target.autocomplete)
   {
     event.target.autocomplete = "whatever";
   }

};

This solution works for me.

let me know if it works for you ;)

来源：https://stackoverflow.com/questions/50347574/disable-chrome-auto-complete-feature-in-react-js

标签

reactjs

google-chrome

autofill