οnfοcus=“this.removeAttribute(‘readonly’);” readonly
初始化为只读,当聚焦时去掉只读属性,只读可以防止浏览器自动填充。
-webkit-text-security:指定要使用的形状来代替文字的显示
none 无。
circle 圆圈。
disc 圆形。
square 正方形。
<el-form-item prop="password"><el-input:key="passwordType"ref="password":type="passwordType"v-model="loginForm.password"placeholder="请输入密码"no-autocompletename="password"tabindex="2"auto-complete="off"readonlyonfocus="this.removeAttribute('readonly');":class="pwdClass==true?'no-autofill-pwd':'no-auto2'"clearable/><span class="show-pwd" @click="showPwd"><svg-icon:icon-class="passwordType === 'text' ? 'eye' : 'eye-open'"/></span></el-form-item>
data(){return{passwordType: "text",pwdClass:true,}
},
methods:{showPwd() {if (this.passwordType === "text") {this.passwordType = "";this.pwdClass = false} else {this.pwdClass = truethis.passwordType = "text";}this.$nextTick(() => {this.$refs.password.focus();});},
}
.show-pwd {position: absolute;right: 10px;top: 3px;font-size: 16px;color: #138a7a;cursor: pointer;user-select: none;
}
.no-autofill-pwd {-webkit-text-security: disc !important;
}
.no-auto2 {-webkit-text-security: none !important;
}