uniapp踩坑之项目:隐藏显示密码功能

1.input组件的password设置为动态前面加:冒号;

2.动态切换眼睛图标使用:style

javascript 复制代码
//html
<view>
密码:<input placeholder="请输入密码" :password="openPassword" type="text" placeholder-style="color:#e2e2e2;" maxlength="20" @input="getPassword" />
<img :src="openPassword?'./../../static/images/passwordshow.png':'./../../static/images/passwordfalse.png'" @tap="isShowPassword">
</view>

//data
openPassword: true, // 眼睛/密码隐藏显示
     
//js
// 密码隐藏显示
isShowPassword () {
 this.openPassword = !this.openPassword;
},

上一篇文章,

uniapp踩坑之项目:uniapp数字键盘组件---APP端-CSDN博客文章浏览阅读196次。uniapp数字键盘组件---APP端/在components文件夹创建digitKeyboard文件夹,再创建digitKeyboard.vue。// 数字键盘组件 在项目里main.js中配置如下代码。//main.js全局引入。https://blog.csdn.net/weixin_43928112/article/details/134204799?spm=1001.2014.3001.5501

相关推荐
咔咔库奇2 分钟前
axios取消请求
开发语言·前端·javascript
不锋3 分钟前
van-uploader组件动态设置capture属性不生效问题
前端
Jinxiansen021113 分钟前
Nuxt + Pinia + Element Plus 后台管理系统搭建教程(含源码)
前端·javascript·vue.js
每次的天空20 分钟前
Android第十七次面试总结(Java数据结构)
android·java·面试
奇舞精选21 分钟前
从零实现 Vue 响应式机制:带你吃透依赖收集与更新原理
vue.js
前端小巷子30 分钟前
浏览器的渲染流程:从 HTML 到屏幕显示
前端·javascript·面试
寒山李白33 分钟前
Java中高并发线程池的相关面试题详解
java·开发语言·面试·高并发·线程池·多线程
幼儿园口算大王35 分钟前
Java是实现大根堆
java·开发语言
高山11135 分钟前
面向对象编程的本质
java·面向对象
Maỿbe36 分钟前
java中的CAS机制
java·线程·进程·cas