如何在 React.js 中的 Input 元素上禁用浏览器自动完成

Question

几天前我遇到了这个问题。你有没有人知道如何在 React.js 中的 Input 元素上禁用浏览器自动完成？ 我已经试过了：

• autoComplete="关闭"
• 自动完成=“新密码”

两者都不工作。

谢谢你的回答。

Answer 1

解决方案来自https://www.codementor.io/@leonardofaria/disabling-autofill-in-chrome-zec47xcui

为我解决这个问题的方法是将表单字段设置为只读，然后在用户关注它们时删除该属性。

<input readonly="readonly" onfocus="this.removeAttribute('readonly');" type="text" value="test">

Answer 2

在您的输入元素上删除type属性，一切都会好起来的。你也不需要自动完成。

Answer 3

是的，autoComplete="off" 和 autocomplete="new-password" 都不适用于 chrome。

输入焦点时添加自动完成属性对我有用

onFocus={(event) => { event.target.setAttribute('autocomplete', 'off'); }}