fix: destroyOnClose fails with forceRender

src/DialogWrap.tsx

@@ -14,14 +14,22 @@ import { IDialogPropTypes } from './IDialogPropTypes';
 
 const DialogWrap: React.FC<IDialogPropTypes> = (props: IDialogPropTypes) => {
   const { visible, getContainer, forceRender, destroyOnClose = false, afterClose } = props;
+  const [forceRenderTime, setForceRenderTime] = React.useState<boolean>(forceRender);
   const [animatedVisible, setAnimatedVisible] = React.useState<boolean>(visible);
 
   React.useEffect(() => {
     if (visible) {
       setAnimatedVisible(true);
+      if (destroyOnClose) {
+        setForceRenderTime(false);
+      }
     }
   }, [visible]);
 
+  React.useEffect(() => {
+    setForceRenderTime(forceRender);
+  }, [forceRender]);
+
   // 渲染在当前 dom 里；
   if (getContainer === false) {
     return (
@@ -33,15 +41,16 @@ const DialogWrap: React.FC<IDialogPropTypes> = (props: IDialogPropTypes) => {
   }
 
   // Destroy on close will remove wrapped div
-  if (!forceRender && destroyOnClose && !animatedVisible) {
+  if (!forceRenderTime && destroyOnClose && !animatedVisible) {
     return null;
   }
 
   return (
-    <Portal visible={visible} forceRender={forceRender} getContainer={getContainer}>
+    <Portal visible={visible} forceRender={forceRenderTime} getContainer={getContainer}>
       {(childProps: IDialogChildProps) => (
         <Dialog
           {...props}
+          forceRender={forceRenderTime}
           destroyOnClose={destroyOnClose}
           afterClose={() => {
             afterClose?.();

tests/index.spec.tsx

@@ -113,6 +113,29 @@ describe('dialog', () => {
     });
   });
 
+  it('destroy component when forceRender is true', () => {
+    const wrapper = mount(
+      <Dialog destroyOnClose forceRender>
+        <div>forceRender destroyOnClose</div>
+      </Dialog>,
+    );
+
+    expect(wrapper.find('.rc-dialog-body > div').text()).toEqual('forceRender destroyOnClose');
+
+    // Hide
+    wrapper.setProps({ visible: true });
+    jest.runAllTimers();
+    wrapper.update();
+
+    // Show
+    wrapper.setProps({ visible: false });
+    jest.runAllTimers();
+    wrapper.update();
+
+    expect(wrapper.find('.rc-dialog-body > div')).toHaveLength(0);
+    wrapper.unmount();
+  });
+
   it('esc to close', () => {
     const onClose = jest.fn();
     const wrapper = mount(<Dialog onClose={onClose} visible />);