原生小程序之 input切换 text与password类型

最新推荐文章于 2024-03-14 11:29:09 发布

小小liang

最新推荐文章于 2024-03-14 11:29:09 发布

阅读量678

点赞数

分类专栏：原生小程序文章标签：小程序微信小程序前端

本文链接：https://blog.csdn.net/weixin_47409897/article/details/125634082

版权

原生小程序专栏收录该内容

24 篇文章 0 订阅

订阅专栏

原生小程序之 input切换 text与password类型

login.wxml

    <input type="text" password="{{ !isShowPwd }}"  placeholder="请输入密码" value='{{password}}' maxlength="11" class="phonePassword" placeholder-class="placeholderClass"></input>
          <image class='input-img input-img2' bindtap='changePwdType' src="{{isShowPwd ? '/static/login/viewPassword.png' : '/static/login/hidePassword.png'}}"></image>

login.js

  data: { 
    isShowPwd:true, // 是否显示密码
    phoneNum: '',
    password: '',
  },

  // 切换密码格式
  changePwdType(){
    if (this.data.isShowPwd) {   //如果this.data.isShow为true,则表示为密码小黑点
      this.setData({
        isShowPwd:false,
      })
    } else {
      this.setData({
        isShowPwd: true,
      })
    }
  },