如何通过Vue实现阻止浏览器记住密码功能？

本文共计1177个文字，预计阅读时间需要5分钟。

查找资料+网上搜索到的一些方法：禁用自动完成（现代浏览器大多不支持）+使用autocomplete=new-password+在真实的账号密码框前添加相同name的input框+设置readonly属性，在聚焦时显示。

查找资料

网上查到的一些方法：

• 使用 autocomplete="off"（现代浏览器许多都不支持）
• 使用 autocomplete="new-password"
• 在真正的账号密码框之前增加相同 name 的 input 框
• 使用 readonly 属性，在聚焦时移除该属性
• 初始化 input 框的 type 属性为 text，聚焦时修改为 password
• 使用 type="text"，手动替换文本框内容为星号 “*” 或者 小圆点 “●”

实现过程

用到的字段

data() { return { username: '', password: '', } }

由于 autocomplete="off" 现代浏览器已经不支持，所以直接放弃了对密码框设置，直接使用 autocomplete="new-password" ，亲测Chrome(v88.0.4324.104)、edge(v88.0.705.56)及火狐(v67)可用，但火狐(v85)还是会提示记住密码。