antd 二级菜单不跟随主菜单收起，文字还显示的问题

感谢，跟我一样遇到这个问题的 靠谱大哥
https://blog.csdn.net/weixin_44180427/article/details/103124890
奈斯啊

我把我全部代码贴上好了，问题解决在上面的链接，记录我的代码

  //递归 渲染子菜单
  renderChildMenu = (currMenu, urlList = '') => {
    return Object.keys(currMenu.children).map(childkey => {
      const key = `${currMenu.children[childkey].url}`;
      const currChildKey = currMenu.children[childkey].url.replace('/', '');
      const children = currMenu.children[childkey].children;
      const name = currMenu.children[childkey].name;
      return (
        children ?
          <SubMenu title={
            <span>
              <Icon type={currMenu.children[childkey].icon} />
              <span>{currMenu.children[childkey].name}</span>
            </span>
          }
            key={currMenu.children[childkey].key} id={key}>
            {this.renderChildMenu(currMenu.children[childkey])}
          </SubMenu>
          :
          <Menu.Item
            className={`${styles.menuChildLi} ${!urlList.includes(currChildKey) && styles.menuChildLiActive}`}
            key={key}
            id={childkey}
            onClick={() => {
              this.onMenuClick({
                route: key,
                title: name
              });
            }}
          >
            <Icon type={currMenu.children[childkey].icon} />
            <span>{currMenu.children[childkey].name}</span>
          </Menu.Item>
      );
    });
  }

  //没有子菜单时，直接渲染（特别注意是 span套span,不然icon会显示不出来 ！！！！！！！！！！！）
  configMenu = (item) => {
    return (
      <Menu.Item key={item.key}
        onClick={() => this.onMenuClick(item.url)}>
        <Icon type={item.icon} />
        <span>{item.title}</span>
      </Menu.Item>);
  }

  //点击收起菜单，改变他的形式
  onCollapse = collapsed => {
    this.setState({ collapsed });
  };

  //点击展开
  onOpenChange = openKeys => {
    const latestOpenKey = openKeys.find(key => this.state.openKeys.indexOf(key) === -1);
    if (this.rootSubmenuKeys.indexOf(latestOpenKey) === -1) {
      this.setState({ openKeys });
    } else {
      this.setState({
        openKeys: latestOpenKey ? [latestOpenKey] : [],
      });
    }
  };

  render() {
    const { publicmenu :{collapsed,curactiveKey}} = this.props;
    const menu = Object.keys(menuConfig)
      .map(key => {
        // if (!menuConfig[key].authority) {权限？
        return (
          menuConfig[key].children ? (
            <SubMenu title={
              <span>
                <Icon type={menuConfig[key].icon} />
                <span>{menuConfig[key].name}</span>
              </span>
            }
              key={menuConfig[key].key} id={key}>
              {this.renderChildMenu(menuConfig[key])}
            </SubMenu>
          ) : (
              <Menu.Item
                style={{ display: `${menuConfig[key].hidden ? `none` : 'inline-block'}` }}
                key={menuConfig[key].url}
                onClick={() => this.onMenuClick({
                  route: menuConfig[key].url,
                  title: menuConfig[key].name
                })}
                id={key}
              >
                <Icon type={menuConfig[key].icon} />
                <span>{menuConfig[key].name}</span>
              </Menu.Item>
            )
        );
        // }
        // return null;
      });

    const defaultProps = collapsed ? {} : { openKeys: this.state.openKeys };

    let widthauto = '';
    collapsed ? widthauto = '78px' : widthauto = '200px';
    return (
      <Sider
        collapsible
        collapsed={collapsed}
        style={{ overflowY: "auto" }}
        breakpoint="lg"
      >
        <div className={styles.logo} id="logo">
          <Link to="/">
            <img src={logo} alt="logo" />
          </Link>
        </div>
        <div style={{ display: 'flex', flexDirection: 'column', height: 'calc(100% - 250px)', paddingRight: 1 }}>
          <div style={{ flex: 1, overflowY: 'auto', overflowX: 'hidden' }} className={styles.star}>
            <Menu theme="dark"
              defaultOpenKeys={this.state.openKeys}
              // defaultOpenKeys={['mock','portfolioMng',]}
              defaultSelectedKeys={[curactiveKey]}
              selectedKeys={[curactiveKey]}
              mode="inline"
              className={styles.sider_menu}
              // openKeys={this.state.openKeys}
              onOpenChange={this.onOpenChange}
              {...defaultProps}
            >
              {menu}
            </Menu>
            <PortSelect widthauto={widthauto} />
          </div>
        </div>
      </Sider>
    );
  }