The SubMenu in the antd Menu component was passed into the Times through the component error.

the SubMenu in the, antd Menu component is passed into the Times through the component. The reason for the preliminary analysis of
is that the build will be wrapped with a label. How to solve this problem?

Screenshots of the specific code are as follows

in the parent component

<Menu
    mode="inline"
    theme="dark"
    openKeys={this.state.openKeys}
    onOpenChange={this.onOpenChange}
    selectedKeys={this.state.selectedKeys}
    onSelect={this.onSelect}
    style={{
      width: "100%"
    }}
      >
    <ProjectAndBoard projectList={this.state.projectList}/>
    <Menu.Item key="/myTask/finish">
      <NavLink
        to={{
          pathname: "/myTask/finish"
        }}
      >
        <Icon type="appstore" />
        <span>  </span>
      </NavLink>
    </Menu.Item>
    <Menu.Item key="/trash">
      <NavLink
        to={{
          pathname: "/trash"
        }}
      >
        <Icon type="appstore" />
        <span>  </span>
      </NavLink>
    </Menu.Item>
</Menu>

screenshot of render function in subcomponent ProjectAndBoard

render() {
    return (
      <SubMenu
        className="create-project"
        key="create"
        title={
          <span>
            <Icon type="plus-circle" theme="outlined" />
            <span>  </span>
          </span>
        }
      />
    );
  }

error message is as follows

clipboard.png

Nov.05,2021

when you import ProjectAndBoard , Menu has not been initialized.

just put ProjectAndBoard and Meun in one file.

or in Menu require ('ProjectAndBoard') (.)


I am also worried about this problem recently. How to solve it in the end? landlord

Menu