有没有办法在 React 中禁用输入的自动填充？

Question

我有一个有几个输入的反应应用程序。问题是，每当我导航到该页面时，它都会使用以前在 Microsoft Edge（新的）上输入的数据自动填充所有字段。我使用 Materialize 进行造型。我这样实现我的表单：

<form onSubmit={this.handleSubmit} autoComplete='off' className="login-form">
    <div className="input-field">
        <input 
        placeholder='Type email here' 
        id="email" 
        type="email"
        required 
        className="validate contact-input" 
        onChange={this.handleChange}/>
        
        <label 
        className="active" 
        htmlFor="email">Email</label>
    </div>

    <div className="input-field">
        <input 
        placeholder='Type password here' 
        id="password" 
        type="password"
        required 
        className="validate contact-input" 
        onChange={this.handleChange}/>

        <label 
        className="active" 
        htmlFor="password">Password</label>
    </div>

    <div className="input-field col s6">
        <button className="btn z-depth-2 login-btn">
            Sign In
        </button>
    </div>
</form>    

我尝试过的一些不起作用的解决方案包括：

<form autoComplete="off">
...
</form>

<form autoComplete="new-password">
...
</form>

<input autoComplete="off" />

<input autoComplete="new-password" />

<input autoComplete="none" />

有人知道如何解决这个问题吗？

Answer 1

试试这个：

<input type="text" autocomplete="off" list="autocompleteOff" 
id="fieldId" name="fieldname" placeholder="Placeholder here" />

从这里回答：Disable input text suggestions in Edge?