怎么阻止Chrome浏览器弹出填充密码的弹框？

Question

怎么阻止Chrome浏览器弹出填充密码的弹框？
目前有个需求需要在密码输入框下面附上格式要求、密码强度之类的东西，如图。但是会被浏览器的填充密码弹框挡住。

Chrome版本： 133.0.6888.2（正式版本）dev （64 位）
技术栈：Vue2 ElementUI

目前尝试过的方案
1、autocomplete设置为off或者new-password，在Chrome上均不生效
2、动态设置readonly，首先会影响样式，其次试了还是无效，等readonly属性移除了又自动弹出来了
3、添加一对隐藏的input，这种方式只能阻止浏览器的默认填充行为，不能阻止弹出这个密码建议

Answer 1

前几年张鑫旭大佬专门写过一篇文章，在最后一个示例里面提到了类似的情况:

大多数情况下，输入框的自动填充行为我们无需处理，用户并不在意输入框颜色变了，或者出现一些样式不一致的提示效果。
但是，有一种情况则不然，那就是输入框本身有下拉行为的时候。
例如开发者自定义了一套Autocomplete组件列表功能，结果用户focus输入框的时候，自定义的列表和系统的自动完成列表同时出现了，就像下面这样：

这个时候就不能不处理了，方法一般就是设置autocomplete属性值是off，如果不行再试试new-password，还是不行试试删除name属性值。

可以到原文里面看一下具体的思路 👉 聊聊:autofill和autocomplete自动填充 « 张鑫旭-鑫空间-鑫生活

Answer 2

https://stackoverflow.com/a/30976223/19162637

autocomplete="one-time-code"