在React JS中禁用Chrome自动完成功能

Question

朋友们

我们要在React JS应用程序中禁用Chrome浏览器中的自动完成功能。我们尝试了互联网上可用的一堆解决方案，但没有任何效果。autoComplete=off不可靠，其他方法也不可靠。

目前这对我们而言确实很重要，因此您能否建议我们采用一种简单的方法来使用React js在Chrome中禁用自动完成功能？

其次，我们为文本框使用一个公共控件/组件，并在各处使用它们

Answer 1

执行autocomplete="new-password"以禁用自动完成。

Answer 2

您可以通过添加onFocus属性覆盖 chrome 自动填充。

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 3

没有什么对我有用new-password，包括，所以我是这样做的：

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