點擊密碼顯示隱藏切換,驗證密碼是否正確
主要使用elment 組件實現
通過改變 type 類型實現
type = password 密碼隱藏
type = " " 爲空時 密碼顯示爲輸入內容
html
<el-form-item prop="user.password">
<el-input
v-model="formData.user.password"
:type="pwdType"
prefix-icon="el-icon-lock"
placeholder="請輸入密碼"
autocomplete="new-password"
>
<i slot="suffix" class="el-icon-view" @click="showPwd"></i>
</el-input>
</el-form-item>
export default{
data(){
pwdType:"password"
}
methods:{
showPwd() {
this.pwdType === "password" ? (this.pwdType = "") : (this.pwdType = "password");
let e = document.getElementsByClassName("el-icon-view")[0];
this.pwdType == ""? e.setAttribute("style", "color: #c0c4cc") : e.setAttribute("style", "color: #409EFF");
},
}
}