fix: Collect FormItem errors should be sync with state (#25737)

* passing error logic

* fix: Collect FormItem errors should be sync with stat

components/form/FormItem.tsx

@@ -122,12 +122,15 @@ function FormItem(props: FormItemProps): React.ReactElement {
   const updateChildItemErrors = noStyle
     ? updateItemErrors
     : (subName: string, subErrors: string[]) => {
-        if (!isEqual(inlineErrors[subName], subErrors)) {
+        setInlineErrors((prevInlineErrors = {}) => {
-          setInlineErrors(prevInlineErrors => ({
+          if (!isEqual(prevInlineErrors[subName], subErrors)) {
+            return {
               ...prevInlineErrors,
               [subName]: subErrors,
-          }));
+            };
           }
+          return prevInlineErrors;
+        });
       };
 
   // ===================== Children Ref =====================

components/form/__tests__/index.test.js

@@ -40,7 +40,8 @@ describe('Form', () => {
     scrollIntoView.mockRestore();
   });
 
-  it('noStyle Form.Item', async () => {
+  describe('noStyle Form.Item', () => {
+    it('work', async () => {
       const onChange = jest.fn();
 
       const wrapper = mount(
@@ -60,6 +61,59 @@ describe('Form', () => {
       expect(onChange).toHaveBeenCalled();
     });
 
+    it('should clean up', async () => {
+      const Demo = () => {
+        const [form] = Form.useForm();
+
+        return (
+          <Form form={form} initialValues={{ aaa: '2' }}>
+            <Form.Item name="aaa">
+              <Input
+                onChange={async () => {
+                  await sleep(0);
+                  try {
+                    await form.validateFields();
+                  } catch (e) {
+                    // do nothing
+                  }
+                }}
+              />
+            </Form.Item>
+            <Form.Item shouldUpdate noStyle>
+              {() => {
+                const aaa = form.getFieldValue('aaa');
+
+                if (aaa === '1') {
+                  return (
+                    <Form.Item name="bbb" rules={[{ required: true, message: 'aaa' }]}>
+                      <Input />
+                    </Form.Item>
+                  );
+                }
+
+                return (
+                  <Form.Item>
+                    <Form.Item name="ccc" rules={[{ required: true, message: 'ccc' }]} noStyle>
+                      <Input />
+                    </Form.Item>
+                  </Form.Item>
+                );
+              }}
+            </Form.Item>
+          </Form>
+        );
+      };
+
+      const wrapper = mount(<Demo />);
+      await change(wrapper, 0, '1');
+      expect(wrapper.find('.ant-form-item-explain').text()).toEqual('aaa');
+      await change(wrapper, 0, '2');
+      expect(wrapper.find('.ant-form-item-explain').text()).toEqual('ccc');
+      await change(wrapper, 0, '1');
+      expect(wrapper.find('.ant-form-item-explain').text()).toEqual('aaa');
+    });
+  });
+
   it('`shouldUpdate` should work with render props', () => {
     mount(
       <Form>