解决Vue+element input自动填充与确定密码问题
//自动填充问题1.把input type为password改为text2.-webkit-text-security:disc;直接变成小圆点// 确定密码var validatePass = (rule, value, callback) => {if (value === "") {callback(new Error("请输入密码"));} else {if (this.formLa
·
//自动填充问题
1.把input type为password改为text
2.-webkit-text-security:disc;直接变成小圆点
// 确定密码
var validatePass = (rule, value, callback) => {
if (value === "") {
callback(new Error("请输入密码"));
} else {
if (this.formLabelAlign1.pwdconfirm !== "") {
this.$refs.formLabelAlign1.validateField("pwdconfirm");
}
callback();
}
};
var validatePass2 = (rule, value, callback) => {
if (value === "") {
callback(new Error("请再次输入密码"));
} else if (value !== this.formLabelAlign1.newPwd) {
callback(new Error("两次输入密码不一致!"));
} else {
callback();
}
};
<el-form
label-width="90px"
class="demo-form-inline userManagement_from"
:model="formLabelAlign1"
:rules="rules"
ref="formLabelAlign1"
>
<el-form-item label="用户名:" prop="loginname">
<el-input v-model="formLabelAlign1.loginname" type="text"></el-input>
</el-form-item>
<el-form-item label="密码:" prop="pwd" v-if="title == '添加'">
<el-input
type="text"
v-model="formLabelAlign1.pwd"
autocomplete="off"
style="-webkit-text-security:disc;"
></el-input>
</el-form-item>
<el-form-item label="密码确认:" prop="pwdconfirm" v-if="title == '添加'">
<el-input
type="text"
v-model="formLabelAlign1.pwdconfirm"
autocomplete="off"
style="-webkit-text-security:disc;"
></el-input>
</el-form-item>
<el-form-item label="手机:" prop="phone">
<el-input v-model="formLabelAlign1.phone" maxlength="11"></el-input>
</el-form-item>
<el-form-item label="邮箱:" prop="email">
<el-input v-model="formLabelAlign1.email"></el-input>
</el-form-item>
</el-form>
data() {
var validatePass = (rule, value, callback) => {
if (value === "") {
callback(new Error("请输入密码"));
} else {
if (this.formLabelAlign1.pwdconfirm !== "") {
this.$refs.formLabelAlign1.validateField("pwdconfirm");
}
callback();
}
};
var validatePass2 = (rule, value, callback) => {
if (value === "") {
callback(new Error("请再次输入密码"));
} else if (value !== this.formLabelAlign1.newPwd) {
callback(new Error("两次输入密码不一致!"));
} else {
callback();
}
};
return {
formLabelAlign1: {},
rules: {
loginname: [{ required: true, message: "请输入用户名", trigger: "blur" }],
pwd: [
{ required: true, message: "请输入密码", trigger: "blur" },
{
min: 6,
max: 16,
message: "长度在 6 到 16 个字符",
trigger: "blur",
},
{ validator: validatePass, trigger: "blur" },
],
pwdconfirm: [
{ required: true, message: "请确认密码", trigger: "blur" },
{
min: 6,
max: 16,
message: "长度在 6 到 16 个字符",
trigger: "blur",
},
{ validator: validatePass2, trigger: "blur", required: true },
],
phone: [
{
required: true,
message: "请输入手机号",
trigger: "blur",
},
{ validator: checkPhone, trigger: "blur" },
],
email: [
{ required: true, message: "请输入邮箱", trigger: "blur" },
{ validator: checkMail, trigger: "blur" },
],
},
};
},
更多推荐
已为社区贡献1条内容
所有评论(0)