From 9a01c9ea0ba7ccc5863934678b91f39e94193858 Mon Sep 17 00:00:00 2001 From: zombiej Date: Tue, 19 Jan 2021 11:53:44 +0800 Subject: [PATCH] fix: name connect --- components/form/FormItem.tsx | 16 +++++++++++++--- components/form/context.tsx | 2 +- 2 files changed, 14 insertions(+), 4 deletions(-) diff --git a/components/form/FormItem.tsx b/components/form/FormItem.tsx index aff0594448..b22dee3934 100644 --- a/components/form/FormItem.tsx +++ b/components/form/FormItem.tsx @@ -20,6 +20,8 @@ import { cloneElement, isValidElement } from '../_util/reactNode'; import useFrameState from './hooks/useFrameState'; import useItemRef from './hooks/useItemRef'; +const NAME_SPLIT = '__SPLIT__'; + const ValidateStatuses = tuple('success', 'warning', 'error', 'validating', ''); export type ValidateStatus = typeof ValidateStatuses[number]; @@ -115,7 +117,7 @@ function FormItem(props: FormItemProps): React.ReactElemen React.useEffect( () => () => { destroyRef.current = true; - updateItemErrors(nameRef.current.join('__SPLIT__'), []); + updateItemErrors(nameRef.current.join(NAME_SPLIT), []); }, [], ); @@ -126,8 +128,13 @@ function FormItem(props: FormItemProps): React.ReactElemen // Collect noStyle Field error to the top FormItem const updateChildItemErrors = noStyle ? updateItemErrors - : (subName: string, subErrors: string[]) => { + : (subName: string, subErrors: string[], originSubName: string) => { setInlineErrors((prevInlineErrors = {}) => { + // Clean up origin error when name changed + if (originSubName !== subName) { + delete prevInlineErrors[originSubName]; + } + if (!isEqual(prevInlineErrors[subName], subErrors)) { return { ...prevInlineErrors, @@ -280,12 +287,15 @@ function FormItem(props: FormItemProps): React.ReactElemen const fieldId = getFieldId(mergedName, formName); if (noStyle) { + // Clean up origin one + const originErrorName = nameRef.current.join(NAME_SPLIT); + nameRef.current = [...mergedName]; if (fieldKey) { const fieldKeys = Array.isArray(fieldKey) ? fieldKey : [fieldKey]; nameRef.current = [...mergedName.slice(0, -1), ...fieldKeys]; } - updateItemErrors(nameRef.current.join('__SPLIT__'), errors); + updateItemErrors(nameRef.current.join(NAME_SPLIT), errors, originErrorName); } const isRequired = diff --git a/components/form/context.tsx b/components/form/context.tsx index 294c60d314..4dd5e851c4 100644 --- a/components/form/context.tsx +++ b/components/form/context.tsx @@ -27,7 +27,7 @@ export const FormContext = React.createContext({ /** Form Item Context. Used for Form noStyle Item error collection */ export interface FormItemContextProps { - updateItemErrors: (name: string, errors: string[]) => void; + updateItemErrors: (name: string, errors: string[], originName?: string) => void; } export const FormItemContext = React.createContext({