ReactFC 怎么手动销毁 Drawer 里面的子元素Form

要手动销毁 Drawer 中的子元素 Form，可以使用 React 的状态管理来实现。

首先，在 Drawer 组件的父组件中创建一个状态变量，用于控制 Drawer 是否可见以及是否需要销毁子元素 Form。例如：

import React, { useState } from 'react';
import { Drawer, Button } from 'antd';

const ParentComponent = () => {
  const [visible, setVisible] = useState(false);
  const [destroyForm, setDestroyForm] = useState(false);

  const handleOpenDrawer = () => {
    setVisible(true);
    setDestroyForm(false);
  };

  const handleCloseDrawer = () => {
    setVisible(false);
    setDestroyForm(true);
  };

  return (
    <div>
      <Button onClick={handleOpenDrawer}>打开Drawer</Button>
      <Drawer
        visible={visible}
        onClose={handleCloseDrawer}
        destroyOnClose={destroyForm}
      >
        {destroyForm ? null : <ChildForm />}
      </Drawer>
    </div>
  );
};

const ChildForm = () => {
  // 子元素 Form 的代码
  return <Form />;
};

在上面的代码中，点击按钮时会打开 Drawer，并在关闭 Drawer 时销毁子元素 Form。通过控制 destroyForm 状态变量来实现。

在 Drawer 组件中，将 destroyOnClose 属性设置为 destroyForm 的值，当 destroyForm 为 true 时，Drawer 关闭时会销毁子元素 Form。

这样，当点击关闭 Drawer 按钮时，子元素 Form 将会被销毁