一、解决方案的方法逻辑

1、找到触发【用户密码弹出框】的事件

在密码框的内容为空的情况下，点击密码框会弹出【用户密码弹出框】

在清空密码框中的密码，会弹出【用户密码弹出框】

2、在【用户密码弹出框】弹出之前阻止其弹出

通过mousedown事件设置密码框为readonly,阻止浏览器弹出【用户密码弹出框】

通过watch密码框中的密码，在密码为空的时候设置设置密码框为readonly,阻止浏览器弹出【用户密码弹出框】

在密码框设定为readonly后，立即再通过setTimeout方法取消密码框的readonly属性，这样阻止【用户密码弹出框】弹出后，立即让密码框可输入，用户感觉不到只读设定

二、建立一个测试vue页面，输入如下内容

<el-form-item label="新密码：">
                <el-input v-model="pwd.oldPwd"
                          :show-password="true"
                          placeholder="请输入新密码"
                          ref="oldPwd"
                          auto-complete="new-password"
                          :readonly="pwd.oldPwd == '' && pwd.oldPwdReadonly"
                          name="oldPwd"
                          @mousedown.native="oldPwdMousedownHandle"
                          @focus="oldPwdFocusHandle"
                          @blur="oldPwdBlurHandle">
               	</el-input>
</el-form-item>

三、添加Js内容

var vm = new Vue({
    el: '#app_fran'
    , data: {
        , pwd: {
            oldPwd: ''
            , oldPwdReadonly: false
            , newPwd: ''
            , newPwdReadonly: false
            , rptPwd: ''
            , rptPwdReadonly: false
        }
    }
    , watch: {
        //监控密码内容
        'pwd.oldPwd': function (newVal, oldVal) {
            inewVal==='' &&  this.oldPwdFocusHandle();
        }
    }
    , methods: {
        //mousedown事件阻止密码选择框弹出
        oldPwdMousedownHandle: function () {
            this.oldPwdFocusHandle();
        }
        //focus事件阻止密码选择框弹出
        , oldPwdFocusHandle: function () {
            this.pwd.oldPwdReadonly = true;
            setTimeout(() => {
                this.pwd.oldPwdReadonly = false;
            }, 10);
        }
        //blur事件后设定密码框为只读，以便再次focus后阻止密码选择框弹出
        , oldPwdBlurHandle: function () {
            this.pwd.oldPwdReadonly = true;
        }
    }
});