diff --git a/components/form/Form.tsx b/components/form/Form.tsx index 289259235..1f6ac45ee 100755 --- a/components/form/Form.tsx +++ b/components/form/Form.tsx @@ -13,7 +13,6 @@ import isEqual from 'lodash-es/isEqual'; import type { Options } from 'scroll-into-view-if-needed'; import scrollIntoView from 'scroll-into-view-if-needed'; import initDefaultProps from '../_util/props-util/initDefaultProps'; -import type { VueNode } from '../_util/type'; import { tuple } from '../_util/type'; import type { ColProps } from '../grid/Col'; import type { @@ -24,6 +23,7 @@ import type { ValidateOptions, Callbacks, ValidateMessages, + Rule, } from './interface'; import { useInjectSize } from '../_util/hooks/useSize'; import useConfigInject from '../_util/hooks/useConfigInject'; @@ -34,32 +34,8 @@ import useForm from './useForm'; export type RequiredMark = boolean | 'optional'; export type FormLayout = 'horizontal' | 'inline' | 'vertical'; -export type ValidationRule = { - /** validation error message */ - message?: VueNode; - /** built-in validation type, available options: https://github.com/yiminghe/async-validator#type */ - type?: string; - /** indicates whether field is required */ - required?: boolean; - /** treat required fields that only contain whitespace as errors */ - whitespace?: boolean; - /** validate the exact length of a field */ - len?: number; - /** validate the min length of a field */ - min?: number; - /** validate the max length of a field */ - max?: number; - /** validate the value from a list of possible values */ - enum?: string | string[]; - /** validate from a regular expression */ - pattern?: RegExp; - /** transform a value before validation */ - transform?: (value: any) => any; - /** custom validate function (Note: callback must be called) */ - validator?: (rule: any, value: any, callback: any, source?: any, options?: any) => any; - - trigger?: string; -}; +/** @deprecated Will warning in future branch. Pls use `Rule` instead. */ +export type ValidationRule = Rule; export const formProps = () => ({ layout: PropTypes.oneOf(tuple('horizontal', 'inline', 'vertical')), @@ -73,7 +49,7 @@ export const formProps = () => ({ /** @deprecated Will warning in future branch. Pls use `requiredMark` instead. */ hideRequiredMark: { type: Boolean, default: undefined }, model: PropTypes.object, - rules: { type: Object as PropType<{ [k: string]: ValidationRule[] | ValidationRule }> }, + rules: { type: Object as PropType<{ [k: string]: Rule[] | Rule }> }, validateMessages: { type: Object as PropType, default: undefined as ValidateMessages, diff --git a/components/form/interface.ts b/components/form/interface.ts index d6082fefe..8ef6ec065 100644 --- a/components/form/interface.ts +++ b/components/form/interface.ts @@ -52,24 +52,36 @@ type Validator = ( export interface ValidatorRule { warningOnly?: boolean; message?: string | VueNode; + /** custom validate function (Note: callback must be called) */ validator: Validator; } interface BaseRule { warningOnly?: boolean; + /** validate the value from a list of possible values */ enum?: StoreValue[]; + /** validate the exact length of a field */ len?: number; + /** validate the max length of a field */ max?: number; + /** validation error message */ message?: string | VueNode; + /** validate the min length of a field */ min?: number; + /** validate from a regular expression */ pattern?: RegExp; + /** indicates whether field is required */ required?: boolean; + /** transform a value before validation */ transform?: (value: StoreValue) => StoreValue; + /** built-in validation type, available options: https://github.com/yiminghe/async-validator#type */ type?: RuleType; + /** treat required fields that only contain whitespace as errors */ whitespace?: boolean; - /** Customize rule level `validateTrigger`. Must be subset of Field `validateTrigger` */ validateTrigger?: string | string[]; + /** Check trigger timing */ + trigger?: 'blur' | 'change' | ['change', 'blur']; } type AggregationRule = BaseRule & Partial;