Отключить функцию автозаполнения Chrome в React JS

Question

Друзья

Мы хотим отключить автозаполнение в браузере Chrome в нашем приложении React JS. Мы перепробовали множество решений, доступных в интернете, но ничего не помогло. autoComplete=off ненадежен, как и другие способы.

Это действительно важно для нас в данный момент, поэтому не могли бы вы предложить нам надежный способ отключить автозаполнение в Chrome с помощью React js?

Во-вторых, мы используем общий элемент управления / компонент для наших текстовых полей и используем их везде

Answer 1

Вы можете переопределить автозаполнение Chrome, добавив атрибут onFocus.

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

В методе onFocus нам нужно изменить атрибут «автозаполнение» с помощью javaScript.

onFocus = event => {

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

};

Это решение работает для меня.

дайте мне знатьесли это работает для вас;)

Answer 2

У меня та же проблема с моим проектом React. Мое решение заключается в использовании случайной строки для атрибута autoComplete. Не используйте «off», согласно Pim , вам нужно установить недопустимое значение, чтобы действительно отключить автоматическое завершение. Также обратите внимание, что имя атрибута должно быть автозаполнением в React.

Answer 3

Единственный взлом, который сработал для меня, - это создать скрытый ввод и добавить случайное число для исходного имени ввода:

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

Answer 4

Do autocomplete="new-password" для отключения автозаполнения.