Остановите автозаполнение Google от перезаписи полей существующими значениями в форме реагирования

Question

У меня есть простая форма в реакции, которая живет в модале. Если бы пользователь использовал автозаполнение для поля электронной почты, например, он обновил бы другие поля, включая поля, которые я уже заполнил. Это привело бы к тому, что пользователи отправляли данные, не зная, что поля в представлении были обновлены.

Я проверил это в нереакционных формах, и автозаполнение Google работает нормально, поскольку оно не перезаписывает существующие значения в полях. Но в режиме реагирования, допустим, я вставил firstname = john, а затем использовал автозаполнение в электронном письме ... оно было бы над 'John' и использовало все, что сохранено в автозаполнении.

Кто-нибудь знает способ обойти это? Я не собираюсь отключать автозаполнение, так как я все еще хочу, чтобы пользователи имели возможность, во всяком случае, я пробовал варианты автозаполнения = выключено, как предложено в другом месте, но без результата

Answer 1

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

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

Answer 2

Вы можете использовать autocomplete = "off" в вашем вводе, который вы не хотите автозаполнять.

Пожалуйста, также убедитесь, что ваши типы ввода верны.

пример: <input type="text" name="foo" placeholder="foo" autocomplete="off">

Вы даже можете сделать это, используя JS:

inputElm.setAttribute ("autocomplete", "off");

в качестве примера.

regards

Аарон