微信小程序、uniapp密码小眼睛

直接上代码喔喔喔喔喔喔喔喔~~

		   <input name="username" password="{{passwordHideShow}}" placeholder-style="color:#bdbdbd" type="text"
               maxlength="20" value="{{passwordNumber}}" bindinput="passwordInput" />

           <view class="icon " catchtap="passwordClick" data-type="pas">
               <image src="{{passwordHideShow?'../../images/look.png':'../../images/noLook.png'}}"></image> 
           </view>
   data: {
        passwordHideShow: true, //小眼睛
        passwordNumber: '', //密码
        // 重复
        passwordHideShow1: true, //小眼睛
        passwordNumber1: '', //密码
    },
	showPwdChange: function() {
        this.setData({
            passwordHideShow: !this.data.passwordHideShow
        })
      },
    passwordClick(e) {
        console.log(this.data.passwordNumber)
        if(e.currentTarget.dataset.type=='pas'){
            // 密码
            this.setData({
                passwordHideShow: this.data.passwordHideShow ? false : true
            })
            return 
        }
        // 重复密码
        this.setData({
            passwordHideShow1: this.data.passwordHideShow1 ? false : true
        })
    },
    passwordInput(e) {
        this.setData({
            passwordNumber: e.detail.value
        })
      },
      passwordInput1(e) {
        this.setData({
            passwordNumber1: e.detail.value
        })
      },

完事啦啦啦啦啦啦啦啦~~~~~~~~~~~

相关推荐

  1. 程序uniapp密码眼睛

    2024-05-14 05:58:13       10 阅读
  2. uniapp_程序_NaN

    2024-05-14 05:58:13       11 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-05-14 05:58:13       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-05-14 05:58:13       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-05-14 05:58:13       18 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-05-14 05:58:13       20 阅读

热门阅读

  1. springboot 开启缓存 @EnableCaching(使用redis)

    2024-05-14 05:58:13       11 阅读
  2. 蓝桥杯备战20.有奖问答_动态规划

    2024-05-14 05:58:13       14 阅读
  3. 【经验分享】SFTP使用指南

    2024-05-14 05:58:13       9 阅读
  4. 云原生周刊:Kubernetes Grafana 看板更新 | 2024.5.13

    2024-05-14 05:58:13       11 阅读
  5. C++ QT设计模式:迭代器模式

    2024-05-14 05:58:13       9 阅读
  6. 阿里云ACP知识点汇总(36000字版)

    2024-05-14 05:58:13       9 阅读
  7. vim工作模式

    2024-05-14 05:58:13       10 阅读
  8. c 指针基础

    2024-05-14 05:58:13       8 阅读
  9. 缓存:Memcache与 Memcached的

    2024-05-14 05:58:13       8 阅读
  10. Spring boot使用websocket实现在线聊天

    2024-05-14 05:58:13       9 阅读
  11. 大数据技术栈2023:Apache Hadoop和Spark实战

    2024-05-14 05:58:13       11 阅读
  12. ffmpeg 读取流报错: Non-monotonous DTS in output stream

    2024-05-14 05:58:13       8 阅读
  13. Ribbon 策略

    2024-05-14 05:58:13       7 阅读