element rules 校验

1、简单的校验,之间通过rules 校验

:rules="{required: true, message: '执行时间不能为空', trigger: 'blur'}"

这个是失去焦点的时候,校验是否有值,如果没有会之间有校验提示

2、通过定义方法校验

:rules="validateTaskName"

这个校验需要定义一个变量,即在data里面return里定义变量:validateTaskName

然后在变量里面定义校验规则:

return {
            validateTaskName:[
                {required: true, message: '任务名称不能为空', trigger: 'blur'},
                {required: true, message: '任务名称不能为中文', validator: checkName,         trigger: 'blur' }
            ],
}

其中可以添加多个校验,比如中文这个,可以通过validator定义一个校验,校验的规则在checkName里面,checkName需要定义在data里面,在return外。这样校验的时候会自动引用checkName进行校验,这里相当于通过方法进行校验。

 data () {
        var checkName = (rule, value, callback) => { 
            var reg = /[\u4E00-\u9FA5\uF900-\uFA2D]/;
            if(reg.test(value)){
                return callback(new Error('任务名称不能为中文'));
            }
	    };
        return {
            validateTaskName:[
                {required: true, message: '任务名称不能为空', trigger: 'blur'},
                {required: true, message: '任务名称不能为中文', validator: checkName, trigger: 'blur' }
            ],
}

3、对整个表达进行校验

这里定义规则校验表单,其中addFormRules里面需要定义每个表单的item的校验规则

addFormRules: {
					name: [
						{ type: "string", required: true, message: '请输入Jenkins名称', trigger: 'blur' }
					],
					ip: [
						{ required: true, validator: checkIP, trigger: 'blur' }
					],
					port: [
						{ required: true, validator: validatePort, trigger: 'blur' }
					],
					userId: [
						{ type: "string", required: true, message: '请输入Jenkins的userId', trigger: 'blur' }
					],
					apiToken: [
						{ type: "string", required: true, message: '请输入Jenkins的apiToken', trigger: 'blur' }
					]
				},

 

 

 

 

 

 

 

 

 

 

 

 

你可能感兴趣的:(element,element,rules)