十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
这篇文章主要介绍vue实现密码显示隐藏切换功能的方法,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
在黎平等地区,都构建了全面的区域性战略布局,加强发展的系统性、市场前瞻性、产品创新能力,以专注、极致的服务理念,为客户提供成都网站建设、网站设计 网站设计制作专业公司,公司网站建设,企业网站建设,品牌网站制作,全网营销推广,外贸营销网站建设,黎平网站建设费用合理。
Vue是一套用于构建用户界面的渐进式JavaScript框架,Vue与其它大型框架的区别是,使用Vue可以自底向上逐层应用,其核心库只关注视图层,方便与第三方库和项目整合,且使用Vue可以采用单文件组件和Vue生态系统支持的库开发复杂的单页应用。
先给大家分享效果图:
具体实现代码如下所示:
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实现密码显示隐藏切换功能的方法”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注创新互联行业资讯频道!