先给大家分享效果图:
具体实现代码如下所示:
html:
设置密码
script:
data () {
return {
registration_data:{
pwdtype:"password",
src:require("../assets/colse_eyes.png")
}
}
},
methods:{
changetype(){
this.registration_data.pwdtype = this.registration_data.pwdtype==='password'?'text':'password';
this.registration_data.src=this.registration_data.src==require("../assets/colse_eyes.png")?require("../assets/open_eyes.png"):require("../assets/colse_eyes.png");
}
}
注:带小眼睛的睁开闭合。
总结
以上所述是小编给大家介绍的vue实现密码显示隐藏切换功能,希望对大家有所帮助