vue中登录密码的明文和暗文的切换

1、明文（text）和暗文（password）
首先声明一个flag变量来做三元表达式的判断，:type=“flag == true?‘password’:‘text’”
然后img绑定变换的两张图片，给img添加一个change事件。

image.png

2、vue中js的代码

export default {
    name: '',
    data() {
        return {
            title,
            flag: false,// 默认是显示明文暗文
          
            loginForm: {
                 userName: '',
                 password: '',
                code: ''
            },
            registration_data: {
                pwdType: 'password',
                src: require('../../assets/closeeyes.png')
            },
        };
    },
    methods: {
        // 是否显示输入的密码
        changeType() {
            this.flag = !this.flag;
            if (this.flag == true) {
                this.registration_data.src = require('../../assets/openeyes.png');
            } else {
                this.registration_data.src = require('../../assets/closeeyes.png');
            }
        },