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

相关推荐
NE_STOP1 天前
MyBatis-mybatis入门与增删改查
java
一拳不是超人1 天前
Electron主窗口弹框被WebContentView遮挡?独立WebContentView弹框方案详解!
前端·javascript·electron
anyup1 天前
🔥2026最推荐的跨平台方案:H5/小程序/App/鸿蒙,一套代码搞定
前端·uni-app·harmonyos
雮尘1 天前
如何在非 Claude IDE (TARE、 Cursor、Antigravity 等)下使用 Agent Skills
前端·agent·ai编程
icebreaker1 天前
Weapp-vite:原生模式之外,多一种 Vue SFC 选择
前端·vue.js·微信小程序
icebreaker1 天前
重走 Vue 长征路 Weapp-vite:编译链路与 Wevu 运行时原理拆解
前端·vue.js·微信小程序
wuhen_n1 天前
代码生成:从AST到render函数
前端·javascript·vue.js
Lee川1 天前
从异步迷雾到优雅流程:JavaScript异步编程与内存管理的现代化之旅
javascript·面试
喝咖啡的女孩1 天前
浏览器前端指南
前端
wuhen_n1 天前
AST转换:静态提升与补丁标志
前端·javascript·vue.js