Как отключить автозаполнение формы в semantic-ui-react?

Как отключить автозаполнение формы с учетными данными в semantic-ui-react? Пробовал это, но это не работает

import { Form } from 'semantic-ui-react';
<Form autoComplete="off">
....
</Form>

person igo    schedule 03.03.2018    source источник
comment
Смешной. Я хотел бы заставить его работать, а не предотвращать его. Для меня это просто не работает, даже с правильными атрибутами автозаполнения для элементов ввода в DOM...   -  person Jovica Aleksic    schedule 15.08.2018


Ответы (5)


Я не думаю, что вы можете поставить autoComplete на Form. Вместо этого попробуйте это либо на Form.Group, либо на каждом Input.

person morinx    schedule 03.03.2018
comment
Действительно, это работает, но вам нужно помнить о случае с заглавной C, как вы написали выше, даже если он показывает autocomplete при отображении как атрибут HTML... - person Christophe Vidal; 18.12.2018

<Form autoComplete="off">
</Form>

У меня работает... Не должно быть проблемой

person Imran    schedule 18.09.2018

Он должен работать. Он работает на моем, когда я тестировал его в своем приложении. Так что это не проблема с Semantic-UI-React.

person hwkd    schedule 03.03.2018

В моем случае это не сработало, имя поля раскрывающегося списка - «состояние», поэтому автозаполнение адреса Chrome игнорирует атрибут автозаполнения. После некоторой борьбы я обнаружил, что role="presentation" делает свое дело. Итак, я получаю входную ссылку из раскрывающегося списка с помощью ref.ref.firstChild и setAttribute('role', 'presentation'). Работает как часы

person Zhenxi    schedule 14.06.2019

<Form autoComplete="off"> будет преобразован в HTML <form autocomplete="off"> (ссылка1), и будет затем отключите автозаполнение для всех полей формы, кроме паролей из-за link2, где мы также можем прочитать:

Если вы определяете страницу управления пользователями, на которой пользователь может указать новый пароль для другого человека, и поэтому вы хотите предотвратить автозаполнение полей пароля, вы можете использовать autocomplete="new-password".

Что приводит ко второй части ответа: как установить атрибут autocomplete для отдельных полей? либо off, либо новый-пароль, либо любой из ссылка1 (имя, адрес электронной почты, страна…).

Компоненты не имеют для этого специального реквизита (link3), но это может быть разрешено путем передачи шаблона содержимого компоненту:

<Form.Input type="password" name="mypassword" required>
    <input autoComplete="new-password" />
</Form.Input>

Затем компонент объединит как атрибуты шаблона, так и его реквизиты для рендеринга:

<div class="ui input">
    <input autocomplete="new-password" name="mypassword" required="" type="password">
</div>
person challet    schedule 05.12.2019