fix(table): add Form.Item shouldUpdate function

ant-design · Jun 17, 2023 · db3224b · db3224b
1 parent 7933961
commit db3224b
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 12 deletions.
diff --git a/packages/table/src/utils/cellRenderToFromItem.tsx b/packages/table/src/utils/cellRenderToFromItem.tsx
@@ -1,11 +1,6 @@
 import type { ProFieldEmptyText } from '@ant-design/pro-field';
 import type { ProFormFieldProps } from '@ant-design/pro-form';
-import {
-  FieldContext,
-  ProForm,
-  ProFormDependency,
-  ProFormField,
-} from '@ant-design/pro-form';
+import { FieldContext, ProForm, ProFormField } from '@ant-design/pro-form';
 import type {
   ProFieldValueType,
   ProSchemaComponentTypes,
@@ -16,6 +11,8 @@ import {
   InlineErrorFormItem,
   runFunction,
 } from '@ant-design/pro-utils';
+import { Form } from 'antd';
+import get from 'rc-util/lib/utils/get';
 import React, {
   useCallback,
   useContext,
@@ -237,9 +234,23 @@ const CellRenderFromItem = <T,>(props: CellRenderFromItemProps<T>) => {
     typeof columnProps?.formItemProps === 'function'
   ) {
     return (
-      <ProFormDependency name={[rowName]}>
+      <Form.Item
+        noStyle
+        shouldUpdate={(pre, next) => {
+          if (pre === next) return false;
+          const shouldName = [rowName].flat(1);
+          try {
+            return (
+              JSON.stringify(get(pre, shouldName)) !==
+              JSON.stringify(get(next, shouldName))
+            );
+          } catch (error) {
+            return true;
+          }
+        }}
+      >
         {() => generateFormItem()}
-      </ProFormDependency>
+      </Form.Item>
     );
   }
   return generateFormItem();

diff --git a/packages/utils/src/components/InlineErrorFormItem/index.tsx b/packages/utils/src/components/InlineErrorFormItem/index.tsx
@@ -94,10 +94,15 @@ const InternalFormItemFunction: React.FC<InternalProps & FormItemProps> = ({
       rules={rules}
       hasFeedback={false}
       shouldUpdate={(prev, next) => {
+        if (prev === next) return false;
+        const shouldName = [name].flat(1);
+        if (shouldName.length > 1) {
+          shouldName.pop();
+        }
         try {
           return (
-            JSON.stringify(get(prev, [name].flat(1))) !==
-            JSON.stringify(get(next, [name].flat(1)))
+            JSON.stringify(get(prev, shouldName)) !==
+            JSON.stringify(get(next, shouldName))
           );
         } catch (error) {
           return true;
@@ -155,10 +160,15 @@ export const InlineErrorFormItem = (props: InlineErrorFormItemProps) => {
       shouldUpdate={
         name
           ? (prev, next) => {
+              if (prev === next) return false;
+              const shouldName = [name].flat(1);
+              if (shouldName.length > 1) {
+                shouldName.pop();
+              }
               try {
                 return (
-                  JSON.stringify(get(prev, [name].flat(1))) !==
-                  JSON.stringify(get(next, [name].flat(1)))
+                  JSON.stringify(get(prev, shouldName)) !==
+                  JSON.stringify(get(next, shouldName))
                 );
               } catch (error) {
                 return true;