如何在 antd AutoComplete 組件中禁用 Chrome 自動填充

Question

我正在使用antd AutoComplete組件（請參閱此處的文檔），它應該是 CRM 的一部分，其中用戶輸入潛在客戶的電話號碼， <AutoComplete />組件建議來自客戶列表的電話號碼數據庫中存在的聯系人。

顯然，瀏覽器保存的用戶個人聯系人數據對於這樣的輸入是沒有用的。

所以，問題是我一直受到 Chrome 自動填充下拉菜單的干擾，如下圖所示

您可以看到不需要的下拉列表隱藏了由 antd AutoComplete創建的下拉列表

問題是，因為我在AutoComplete組件上設置了autocomplete屬性，當我在 Devtools 中檢查時，我看到該屬性沒有被傳遞到 antd 使用的包裝輸入元素中。 請問我該如何解決這個問題？

Answer 1

這已在antd版本4.6.3中修復。
對於早期版本，您需要使用此答案並將自動完成屬性設置為隨機字符串：

<AutoComplete
  options={options}
  style={{
    width: 200
  }}
  placeholder="input here"
  autoComplete={"nope"}
/>