react如何去除input记忆

使用 autoComplete 属性

将 input 元素的 autoComplete 属性设置为 "off"，可以禁用浏览器的自动填充和记忆功能。

<input type="text" autoComplete="off" />

使用随机 name 或 id

某些浏览器会根据 name 或 id 属性存储输入历史，可以通过动态生成随机值避免记忆。

<input type="text" name={`input-${Math.random()}`} />

使用表单包裹并设置 autoComplete

将 input 放在 form 中，并设置表单的 autoComplete 为 "off"，增强兼容性。

<form autoComplete="off">
  <input type="text" />
</form>

使用 readOnly 和 onFocus 结合

通过 readOnly 阻止自动填充，再在 onFocus 事件中移除该属性，确保用户仍可手动输入。

<input 
  type="text" 
  readOnly 
  onFocus={(e) => e.target.removeAttribute('readonly')} 
/>

使用非文本类型规避

某些浏览器仅对 type="text" 的记忆行为较强，可改用其他类型（如 type="search"）临时规避。

<input type="search" autoComplete="off" />

动态修改 autocomplete 值

部分浏览器对 autoComplete 的解析存在差异，尝试动态切换其值（如 "new-password"）。

<input type="text" autoComplete="new-password" />