chrome自带buff，对于属性type="password"的输入框会自动保存密码；
下次遇到type="password" 的输入框时候，会自动填充密码；
你在输入不同的密码之后，还会很人性的提示你是否需要更新密码。
这样也许对用户是好事，但是太频繁的的弹框提示，并不表示所有的业务场景都需要。
我们项目中，只在登录模块允许浏览器保存密码，由于是高频操作的产品，其他任何地方输入框禁止出现浏览器弹框提示更新密码，或者保存密码的操作。
这样一来就必须解决浏览器这个属性了，翻遍网上的方案，大致分为：
1.使用 autocomplete="off" 、 autocomplete="new password" 、 autocomplete="false" ，禁止自动填充。
2.获取焦点时候切换 type 或者readonly属性，这种没什么效果，自动填充好解决
<input type="password" name="Password" autocomplete="off" readonly
onfocus="this.removeAttribute('readonly');" >
思来想去，只要type为password，那么就会有这个问题，那就不用password类型，
一开始想到的山寨方法，使用伪类或者字体图标实现密码框的原点效果，遮挡在text类型上的文字上面，也能实现，存在的问题是，不能切换为英文输入法，中文时候也能录入。
还有一种解决方法，可以实现禁止弹更新密码的弹窗，就是监听输入框input事件，每次输入时候，将value置为空，延时赋值，不过带来新的问题是，输入框下面出现密码选择的列表。
<el-input type="text" v-model.trim="password"
autocomplete="off" value=""
@input="handlePwdChange">
</el-input>
...
handlePwdChange(v) {
this.password = ''
setTimeout(() => {
this.password = v
}, 0)
},
- 翻了翻stackoverflow，发现一个hack方法，跟我的有异曲同工之妙，
type="text"
style="text-security:disc; -webkit-text-security:disc;"
这个存在兼容问题，只能webkit内核的浏览器上工作，该属性后面会不会被干掉也不能保证，好在我们的项目要求必须使用chrome浏览器，嘎嘎。暂时解决了，这个同样存在不能限制输入法的问题。
怎么不允许输入中文，那就用正则吧，
onkeyup="this.value=this.value.replace(/[\u4e00-\u9fa5]/g,'')"
- 同上面的方法，可以使用字体图标，建立自己的text-security
[https://github.com/kylewelsby/dotsfont](https://github.com/kylewelsby/dotsfont)
@font-face
{
font-family:'dotsfont';
src:url('dotsfont.eot');
src:url('dotsfont.eot?#iefix') format('embedded-opentype'),
url('dotsfont.svg#font') format('svg'),
url('dotsfont.woff') format('woff'),
url('dotsfont.ttf') format('truetype');
font-weight:normal;
font-style:normal;
}
input.myclass
{-webkit-text-security:disc;font-family:dotsfont;}
暂时的解决方法：(不考虑非webkit内核浏览器)
<el-input
type="text"
v-model.trim="pass"
:maxlength="20"
onkeyup="this.value=this.value.replace(/[\u4e00-\u9fa5]/g,'')"
oncontextmenu="return false"
onpaste="return false"
oncopy="return false"
oncut="return false"
auto-complete="off" value=""
style="text-security:disc; -webkit-text-security:disc;ime-mode:disabled"
>
</el-input>
