浏览器密码填充问题（360、chrome）

浏览器记住密码后， 新建账号、密码， 会自动填充记住的账号密码。

方法1：

------------360浏览器

type 设置为text，获取焦点后设置成 password。

<input class="form-control" type="text" name="newPassword" onfocus="this.type='password'" id="newPassword" autocomplete="off">

------------chrome浏览器

登录是浏览器记住密码， 在新建用户的表单中有密码输入框。
结果： 打开新建窗口， 密码输入框会自动填充记住的登录密码。

解决办法：
input 标签使用 autocomplete属性， 值为‘new-password’

<el-input type="password" v-model="ruleForm.password" maxlength="16" placeholder="请输入" autocomplete="new-password"></el-input>

方法2：

2021.6.24记录：
密码框上加上属性： autocomplete=“new-password”， chrome解决了。
但是360浏览器， 还是会自动填充。

有人用这种方法：

<el-form-item label="手机号" prop="phone">
     <el-input v-model="form.phone" placeholder="输入手机号" maxlength="11" autocomplete="off"></el-input>
     <el-input class="inputBar"></el-input>
</el-form-item>
<el-form-item label="密码" prop="passwd">
   <el-input type="password" class="inputBar"></el-input>
   <el-input v-model="form.passwd" placeholder="输入密码" maxlength="20" type="password" autocomplete="new-password"></el-input>
</el-form-item>
<el-form-item label="再次输入密码" prop="checkPass">
    <el-input type="password" class="inputBar"></el-input>
    <el-input v-model="form.checkPass" placeholder="再次输入密码" maxlength="20" type="password" autocomplete="new-password"></el-input>
</el-form-item>

不知道为什么， 我打开弹窗会自动校验一样， 然后显示“请输入手机号”的错误。

方法3：readonly

<el-input v-model="form.phone" placeholder="输入手机号" maxlength="11" autocomplete="off"></el-input>


// 密码框： autocomplete="new-password"
<el-input v-model="form.passwd" placeholder="输入密码" maxlength="20" :readonly="psw1" type="password" @focus="psw1 = false" @blur="psw1=true" autocomplete="new-password"></el-input>

默认只读， 获取焦点时， 改成可写。

经测试， chrome、360 等浏览器，可以解决填充问题。
——————————————————————————————
小问题：现在， chrome下focus的时候有记住的密码下拉项。

解决： ???