Custom Validation Rules

For multi-value validation, the Form component's validators prop provides comprehensive functionality to implement custom validation. For single-value validation, the Field component contains 7 built-in common rules, please refer to its rule prop. If those cannot meet your requirements, the VEUI validation rule module allows you to add custom rules.

Examples

import ruleManager from 'veui/managers/rule'
ruleManager.addRule('range', {
  validate (value, ruleValue) {
    // Only implement the range comparison part
    let range = value.split('-')
    return +range[0] >= ruleValue.floor && +range[1] <= ruleValue.ceil
  },
  message: 'The range value must be within the specified range.',
  priority: 100
})

<template>
<veui-field
  :rules="[{
    triggers: 'change'
    name: 'range',
    value: {
      ceil: 100,
      floor: 50
    }
  }]"
  ...
>...</veui-field>
</template>

API

let minLengthRule = {
  validate (value, ruleValue) {
    return !isEmpty(value) ? val.length >= ruleValue : true
  },
  message: 'The character length cannot be shorter than {ruleValue}, the current length is {value}.',
  priority: 100
}

let minLengthRule = {
  validate (value, ruleValue) {
    return !isEmpty(value) ? val.length >= ruleValue : true
  },
  message (ruleValue, value) {
    return `The character length cannot be less than ${ruleValue}, the current length is ${value}.`
  },
  priority: 100
}