diff --git a/.changeset/stupid-cougars-attack.md b/.changeset/stupid-cougars-attack.md new file mode 100644 index 000000000..4dd0e78a1 --- /dev/null +++ b/.changeset/stupid-cougars-attack.md @@ -0,0 +1,5 @@ +--- +"@hi-ui/form": minor +--- + +feat: add showValidateMessage api diff --git a/.changeset/tasty-spies-invite.md b/.changeset/tasty-spies-invite.md new file mode 100644 index 000000000..678d419a3 --- /dev/null +++ b/.changeset/tasty-spies-invite.md @@ -0,0 +1,5 @@ +--- +"@hi-ui/hiui": patch +--- + +feat(form): add showValidateMessage api diff --git a/packages/ui/form/src/Form.tsx b/packages/ui/form/src/Form.tsx index 1975ecbfe..0f125927c 100644 --- a/packages/ui/form/src/Form.tsx +++ b/packages/ui/form/src/Form.tsx @@ -29,6 +29,7 @@ export const Form = forwardRef( contentPosition = 'center', showRequiredOnValidateRequired = false, showColon = true, + showValidateMessage = true, ...rest }, ref @@ -61,17 +62,19 @@ export const Form = forwardRef( showColon, contentPosition, showRequiredOnValidateRequired, + showValidateMessage, ...formContext, prefixCls, } }, [ labelWidth, - formContext, labelPlacement, showColon, - prefixCls, contentPosition, showRequiredOnValidateRequired, + showValidateMessage, + formContext, + prefixCls, ]) const cls = cx(prefixCls, className, placement && `${prefixCls}--placement-${placement}`) @@ -118,6 +121,11 @@ export interface FormProps> * FormItem 开启 filed 的 required 校验时,展示红色星号 */ showRequiredOnValidateRequired?: boolean + /** + * 是否显示校验提示 + * @default true + */ + showValidateMessage?: boolean } if (__DEV__) { diff --git a/packages/ui/form/src/FormLabel.tsx b/packages/ui/form/src/FormLabel.tsx index 704741da4..3489c0dd2 100644 --- a/packages/ui/form/src/FormLabel.tsx +++ b/packages/ui/form/src/FormLabel.tsx @@ -16,6 +16,7 @@ export const FormLabel = forwardRef((prop labelPlacement: labelPlacementContext, showColon: showColonContext, contentPosition: contentPositionContext, + showValidateMessage: showValidateMessageContext, } = useFormContext() const { @@ -32,6 +33,7 @@ export const FormLabel = forwardRef((prop contentPosition = contentPositionContext, labelPlacement = labelPlacementContext, formMessage, + showValidateMessage: showValidateMessageProp = showValidateMessageContext, ...rest } = props @@ -92,7 +94,9 @@ export const FormLabel = forwardRef((prop {children} -
{formMessage}
+ {showValidateMessageProp && ( +
{formMessage}
+ )} ) }) @@ -126,6 +130,10 @@ export interface FormLabelProps extends HiBaseHTMLProps<'div'> { * 提示信息 */ formMessage?: ReactNode + /** + * 是否显示校验提示。优先级高于 Form 设置的 showValidateMessage + */ + showValidateMessage?: boolean } if (__DEV__) { diff --git a/packages/ui/form/src/context.ts b/packages/ui/form/src/context.ts index 0803192ab..e1aff7fa7 100644 --- a/packages/ui/form/src/context.ts +++ b/packages/ui/form/src/context.ts @@ -8,6 +8,7 @@ export interface FormContextProps extends UseFormReturn { contentPosition: 'top' | 'center' | 'bottom' showColon: boolean showRequiredOnValidateRequired: boolean + showValidateMessage: boolean prefixCls: string } diff --git a/packages/ui/form/stories/get-values.stories.tsx b/packages/ui/form/stories/get-values.stories.tsx index f087fa8e7..6252945b5 100644 --- a/packages/ui/form/stories/get-values.stories.tsx +++ b/packages/ui/form/stories/get-values.stories.tsx @@ -51,7 +51,7 @@ export const GetValues = () => { - + + + + + + + ) +}