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

相关推荐
毕设源码-邱学长4 小时前
【开题答辩全过程】以 基于Java的学校住宿管理系统的设计与实现为例,包含答辩的问题和答案
java·开发语言
bearpping5 小时前
Nginx 配置:alias 和 root 的区别
前端·javascript·nginx
@大迁世界5 小时前
07.React 中的 createRoot 方法是什么?它具体如何运作?
前端·javascript·react.js·前端框架·ecmascript
January12076 小时前
VBen Admin Select 选择框选中后仍然显示校验错误提示的解决方案
前端·vben
. . . . .6 小时前
前端测试框架:Vitest
前端
xiaotao1316 小时前
什么是 Tailwind CSS
前端·css·css3
兑生6 小时前
【灵神题单·贪心】1481. 不同整数的最少数目 | 频率排序贪心 | Java
java·开发语言
daidaidaiyu6 小时前
一文学习 Spring 声明式事务源码全流程总结
java·spring
颜酱6 小时前
DFS 岛屿系列题全解析
javascript·后端·算法