VUE 密码明暗文交互

输入框代码：

 

<input :type="inputType" placeholder="钱包密码" class="input-1" v-model="password">

直接给利用vue的 :type 给定一个初始值    inputType

然后下方设定一个按钮  点击改变 inputType 的值就可以了

当然 这个按钮是需要绑定值的  因为vue 是以数据驱动的，需要一个数据来改变input 的状态

（这里的按钮是两个不一样的图片）

<img src="../../common/images/password.png" alt="closeEye" class="eye" v-if="eye" @click="showPassword">

<img src="../../common/images/passwordcopy.png" alt="closeEye" class="eye" v-else @click="showPassword">

事件代码：

 

showPassword: function () { /* 密码显示 */
      if (this.eye) {
        this.eye = false
        this.inputType = 'password'
      } else {
        this.eye = true
        this.inputType = 'text'
      }
    }