fix(form): 🐛 DrawerForm cannot get form instance by formRef (ant-desi…

…gn#4421) * fix: 🐛 DrawerForm cannot get form instance by formRef * fix: 🐛 remove unused variable * fix: 🐛 add test case for formRef Co-authored-by: dengqing <qing.deng@goldenpig.com.cn>
qwe104 · Jan 9, 2022 · 179ac82 · 179ac82
1 parent 15ab36f
commit 179ac82
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 1 deletion.
diff --git a/packages/form/src/components/ModalForm/demos/drawer-form.tsx b/packages/form/src/components/ModalForm/demos/drawer-form.tsx
@@ -19,6 +19,7 @@ const waitTime = (time: number = 100) => {
 
 export default () => {
   const formRef = useRef<ProFormInstance>();
+
   return (
     <DrawerForm<{
       name: string;

diff --git a/packages/form/src/layouts/DrawerForm/index.tsx b/packages/form/src/layouts/DrawerForm/index.tsx
@@ -158,7 +158,8 @@ function DrawerForm<T = Record<string, any>>({
     [],
   );
 
-  useImperativeHandle(rest.formRef, () => formRef.current);
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  useImperativeHandle(rest.formRef, () => formRef.current, [shouldRenderFormItems]);
 
   const formDom = (
     <div onClick={(e) => e.stopPropagation()}>

diff --git a/tests/form/drawerForm.test.tsx b/tests/form/drawerForm.test.tsx
@@ -764,4 +764,32 @@ describe('DrawerForm', () => {
     expect(html.baseElement.querySelector('form')).toBeFalsy();
     html.unmount();
   });
+
+  it('📦 drawerForm get formRef when destroyOnClose', async () => {
+    const ref = React.createRef<any>();
+
+    const html = mount(
+      <DrawerForm
+        formRef={ref}
+        drawerProps={{
+          destroyOnClose: true,
+        }}
+        trigger={
+          <Button id="new" type="primary">
+            新建
+          </Button>
+        }
+      >
+        <ProFormText name="name" />
+      </DrawerForm>,
+    );
+
+    waitForComponentToPaint(html, 200);
+    expect(ref.current).toBeFalsy();
+    act(() => {
+      html.find('button#new').simulate('click');
+    });
+    waitForComponentToPaint(html, 200);
+    expect(ref.current).toBeTruthy();
+  });
 });