iview form Related

Steps for View form validation:

First step: Set the property rules:rules for the Form
Step Two: Set the attribute prop for each FormItem you want to verify and point to the corresponding field prop= ""
Step Three: note: The form tag contains: Model
Fourth Step: note: In the form tag must be added ref, equivalent to ID, in this range of forms validation valid
Fifth step: When you manipulate the Save button, add a method to validate the entire form, and the parameter is the callback that is checked, returning a Boolean indicating success and failure
---------------------

<form:label-width= "+" ref= ' Contractform ' : Model= ' Contractform ' : Rules= " Rulevalidate ">
<formitem label= ' contract number: ' prop= ' Contractno ' >
<input placeholder= "Please enter the contract number" v-model= ' Contractform.contractno ' ></Input>
</FormItem>
Data inside, write verification
Rulevalidate: {
contractno:[
{required:true, message: ' Contract number cannot be empty ', Trigger: ' Blur '},
],
}
Methods inside, writing method
AddChange (name) {
this. $refs [Name].validate (valid = {
if (valid) {
}
});
</Form>

iview to verify the failure of the select time when verifying the form:
When validating a select tag with a form that comes with iview, the validation does not pass because the iview default checksum data type is string, and the value of my select is of type number
Rulevalidate: {
customer:[
{required:true, message: ' Customer name cannot be empty ', Trigger: ' Blur ', type: ' Number '},
],
}

View failed to verify the date validation time of the form:
As the drop-down box, the type of date is data
Rulevalidate: {
advance:[
{required:true, message: ' The pre-delivery time cannot be empty ', Trigger: ' Change ', type: ' Date '},
],
}

iview for multi-validation:
Multiple validations include the first test cannot be null, the second to verify some length of the limit, write regular expressions, etc.
Rulevalidate: {
Goodsnum: [
{required:true, message: ' Quantity cannot be empty ', Trigger: ' Blur '},
{type: ' String ', pattern:/^ ([1-9]\d{0,3}) | (\.\d{0,2})? $/, message: ' The quantity should be a positive floating point number and not exceed 9999.99 ', Trigger: ' Blur '},
],
}

//高级配置验证 validateAdvancedFormItem: {   name: [   {required: true , message: ‘任务名称不能为空‘ , trigger: ‘blur‘ },   {type: ‘string‘ , max: 20, message: ‘不能超过20个字符‘ , trigger: ‘blur‘ },   {validator: validNameExist, trigger: ‘blur‘ }   ],   groupId: [   {type: ‘string‘ , required: true , message: ‘请选择任务分组‘ , trigger: ‘change‘ }   ],   keywords: [   {required: true , message: ‘关键词不能为空‘ , trigger: ‘blur‘ },   {type: ‘string‘ , max: 7000, message: ‘不能超过7000个字符‘ , trigger: ‘blur‘ },   {validator: validKeyWordsRule, trigger: ‘blur‘ }   ],   /* chooseSiteGroupList: [//todo 暂时注释掉网站分组    { required: true, type: ‘array‘, min: 1, message: ‘请选择网站分组‘, trigger: ‘change‘ },   ],*/   chooseInfoTypeList: [   {required: true , type: ‘array‘ , min: 1, message: ‘请选择信息类型‘ , trigger: ‘change‘ },   ],   warnNum: [   {required: true , message: ‘请填写预警增量‘ },   ],   warnUserList: [   {required: true , type: ‘array‘ , message: ‘请选择预警人员‘ , validator: validatewarnUser, trigger: ‘change‘ },   ], },Custom Validation Rule methods: //验证高级配置关键词 规则 const validKeyWordsRule = (rule, value, callback) => {   var isExceedTwitenty = this .getAdvancedKeyWords();   var isExceedThreeHundreand = this .getAdvancedKeyWords();   if (isExceedTwitenty == 1) {   callback( new Error( ‘配置单个关键词长度不能超过20‘ ))   } else if (isExceedThreeHundreand == 2) {   callback( new Error( ‘配置关键词个数不能超过300‘ ))   } else {   callback();   } }; //处理关键词 getAdvancedKeyWords: function () {   var flag = -1;   if ( this .dailyTaskItem.keywords != ‘‘ && this .dailyTaskItem.keywords.trim() != ‘‘ ) {   //判断单个配置的关键词长度是否大于20   var str = ‘‘ ;   for ( var i = 0; i < this .dailyTaskItem.keywords.length; i++) {    str = str + this .dailyTaskItem.keywords.substr(i, 1).replace(/[\&|\||\!|\(|\)|\"]/, ‘ ‘ );   }   var keywordArr = str.split( ‘ ‘ );   var resultArr = [];   for ( var i in keywordArr) {    if (keywordArr[i] != ‘‘ ) {    resultArr.push(keywordArr[i])    if (keywordArr[i].trim().length > 20) {     flag = 1;     break    }    }   }   //.关键词一共300个   if (resultArr.length > 300) {    flag = 2;   }   }   return flag; },

iview form Related