iview 表单验证

Posted 2020-11-20 lgjc

<modal v-model="modelPassWord" width="520" title="修改密码"
		:mask-closable="false"> <i-form :label-width="100"
		ref=‘formItemP‘ :model="formItemP" :rules=‘ruleValidateP‘> <form-item
		label="请输入旧密码" prop="oldPwd"> <i-input
		placeholder="请输入旧密码" v-model="formItemP.oldPwd" name=""></i-input> </form-item> <form-item
		label="请输入新密码" prop="newPwd"> <i-input
		placeholder="请输入新密码" v-model="formItemP.newPwd"></i-input> </form-item> <form-item
		label="重新输入密码" prop="repeatPwd"> <i-input
		placeholder="重新输入密码" v-model="formItemP.repeatPwd"></i-input> </form-item> </i-form>
	<div slot="footer">
		<i-button type="ghost" @click="pwdModelCancel">取消</i-button>
		<i-button type="error" @click="pwdModelOk(‘formItemP‘)">确定</i-button>
	</div>
	</modal>

　　

	//修改密码验证
			formItemP: {
				oldPwd: "",
				newPwd: "",
				repeatPwd: ""
			},
			ruleValidateP: {
				oldPwd: [{
					required: true,
					message: ‘请输入旧密码‘,
					trigger: ‘blur‘
				}],
				newPwd: [{
					required: true,
					message: ‘请输入新密码‘,
					trigger: ‘blur‘
				}],
				repeatPwd: [{
					required: true,
					trigger: ‘blur‘,
					validator:function(rule, value, callback){
	                    if (value == ‘‘) {
	                        return callback(new Error(‘请再次输入密码‘));
	                    } else if (value != logoApp.formItemP.newPwd) {
	                        return callback(new Error(‘两次密码不一致‘));
	                    } else {
	                        callback();
	                    }
	                }
				}]
			}

		}