reactjs - ReactJs 蚂蚁设计中的嵌套抽屉

Question

我设计了 3 个嵌套抽屉，除了关闭动作之外，抽屉的一切都很好！这是我这部分的代码：

state = {
    childrenDrawer: false,
    SuccessDrawer: false,
    Drawer: true,
    errorMsg: false,
    loginData: {},
  };
  showDrawer = () => {
    this.setState({
      Drawer: true,
    });
  };

  onDrawerClose = () => {
    this.setState({
      Drawer: false,
    });
    this.props.toggleDrawer();
  };

  showChildrenDrawer = (data) => {
    this.setState({ loginData: data }, () => {
      if (this.state.loginData.response.status === 200) {
        this.setState({
          childrenDrawer: true,
        });
      }
    });
  };

  onChildrenDrawerClose = () => {
    this.setState({
      childrenDrawer: false,

    });
  };
  showSuccessDrawer = () => {
    this.setState({ SuccessDrawer: true });
    // this.props.onSuccessLogIn(true);
  };

  onSuccessDrawerClose = () => {
    this.setState({
      Drawer: false,
      SuccessDrawer: false,
      childrenDrawer: false,
    });
    // this.props.toggleDrawer();
    // this.props.onSuccessLogIn(true);
  };

当我使用 onSuccessDrawerClose（第三个抽屉上的关闭按钮）时，我想关闭所有 3 个抽屉，但它只关闭 SuccessDrawer 和 childrenDrawer，我不知道为什么它不关闭抽屉（第一个抽屉）。

PS：我使用 ant 设计： import { Drawer } from "antd";

标签： reactjs