antd 选择关闭自动完成

Question

我正在尝试关闭 ant design Select 上的自动完成功能，但我尝试的任何方法都不起作用。这显然是有问题的，因为 chromes（此时仅测试了一个）自动完成完全覆盖了选择选项（下图）。

我在 React 中使用 antd 并在 Select 标签和 Form 标签上尝试了以下内容：

autoComplete="off" autoComplete="nope" autoComplete="business-state"

他们似乎都没有关闭它。

这是一个指向几乎相同代码的代码沙箱的链接，但问题是它不会重现相同的问题。出于某种原因，沙箱上完全相同的代码不显示自动完成。我添加了一个电子邮件输入来显示以测试自动完成是否适用于它，并且确实可以。我不知道为什么这在沙箱中的工作方式与我的服务器不同。

https://codesandbox.io/s/wovnzpl9xw

这是当用户键入以搜索选项时的样子

这是它应该是什么样子（它只是在焦点上看起来像这样，但是一旦用户键入 chrome 就会显示自动完成）

Answer 1

找到了我的问题的解决方案，感谢@trkaplan为我指明了正确的方向。我猜这不是最优雅的解决方案，所以如果其他人有更好的方法来实现这一点，我会洗耳恭听。我本质上必须创建一个onFocus方法来Select获取所有带有类ant-select-search__field循环的元素，并利用setAttribute将属性更改autocomplete为任意值以禁用它。

onFocus={() => {
  if (!this.state.autocompleteDisabled) {
    let i;
    const el = document.getElementsByClassName(
      "ant-select-search__field"
    );
    for (i = 0; i < el.length; i++) {
      el[i].setAttribute(
        "autocomplete",
        "registration-select"
      );
    }
    this.setState({ autocompleteDisabled: true });
  }
}}