当前位置: 首页 > news >正文

【Uni-App】uview 开发多端应用,密码显示隐藏功能不生效问题

出现的问题:

使用uview组件u-input框密码绑定时会出现右侧密码显隐图标不显示的问题

思路:

1.看了下uview源码,发现这有一段注释,我们需要把源码修改一下,问题出在这里

 

 这行代码修改为 :password="password || type === 'password' || false"

2.其次发现uview源码里面并没有密码显隐的图标,这就需要我们在使用的页面自己去添加

Input 输入框 | uView 2.0 - 全面兼容 nvue 的 uni-app 生态框架 - uni-app UI 框架 (uviewui.com)

这就需要在u-input框里面使用到后置插槽了

代码

demo样式

1.修改视图层代码,来动态改变icon的样式

	<u-input confirmType="done" v-model="accountForm.userPassword":password="password" :clearable="true" placeholder="请输入您的登录密码":placeholder-style="placeholderStyle" border="none"><template slot="suffix"><u-icon :name="password ? 'eye': 'eye-fill'" size="24"@click="handleShowPass"></u-icon></template></u-input> 

2.逻辑层代码控制密码的显隐

	handleShowPass() {this.password = ! this.password}

实现效果图如下:

http://www.lryc.cn/news/120171.html

相关文章:

  • 人工智能算法-SVM, KNN
  • 计算机网络—TCP
  • Oracle到DM实时数据同步实施方案
  • WebRTC | 音视频实时通信的本质
  • ApiPost的使用
  • 6、CCS 配置工程头文件批量添加路径的方法
  • Visual Studio配置PCL库
  • 数据分析 | 为什么Bagging算法的效果优于单个评估器
  • mysql架构介绍
  • EIK+Filebeat+Kafka
  • python安装xgboost报错
  • 语音芯片的型号有哪些?为什么强烈推荐使用flash型可擦写的
  • 【OpenCV常用函数:轮廓检测+外接矩形检测】cv2.findContours()+cv2.boundingRect()
  • opencv,opengl,osg,vulkan,webgL,opencL,cuda
  • golang拥有wireshark数据包解析能力
  • Redis_分片集群
  • 测试提升方向:你选测试开发?还是性能测试?
  • 无涯教程-Perl - print函数
  • python搜索文件夹内类似的文件名
  • [保研/考研机试] KY3 约数的个数 清华大学复试上机题 C++实现
  • cmake扩展(2)——windows下动态设置输出文件(dll/exe)版本
  • Python-OpenCV中的图像处理-颜色空间转换
  • yolov5目标检测多线程Qt界面
  • [ubuntu]创建root权限的用户 该用户登录后自动切换为root用户
  • 大连交通大学813软件工程考研习题
  • 分布式协议与算法——Paxos算法
  • Spring中的Websocket身份验证和授权
  • 【果树农药喷洒机器人】Part7:静态PWM变量喷药实验
  • C++ 网络编程项目fastDFS分布是文件系统(一)
  • PoseiSwap 开启“Poseidon”池,治理体系或将全面开启