Antd 在Menu组件中递归生成子菜单的BUG

Question

使用Antd组件库的Menu菜单组件，根据后端返回的树形结构数据递归生成了子菜单。BUG是 渲染后点击一个菜单，所有的子菜单都被选中， 并且不能取消

Layout组件部分代码

.....
 <Menu theme="dark" mode="inline" defaultSelectedKeys={['/system']}>
  {
    this.routes.map((route: any, index: number) => <MySubMenu key={index} route={route} />)
  }
</Menu>
....

封装的Submenu组件代码：

export default class MySubmenu extends Component<MySubMenuProps> {

  render() {
    const { route } = this.props
    return route.children ? (
      <SubMenu title={route.meta.title} key={'sub' + route.path}>
        {
          route.children.map((child: any, index: number) => {
            return <MySubmenu key={'sub' + route.path + index} route={child} />
          })
        }
      </SubMenu>
    ) : (
      <Menu.Item key={route.path}>
        <Link to={route.path}>{route.meta.title}</Link>
      </Menu.Item>
    )
  }
}