После обновления до antd версии 2.13.14 (на самом деле последняя версия 2.x) с моим боковым меню происходят странные вещи - возникает разрыв, если элементы меню с более длинными метками свернуты, см. Красную маркировку на скриншоте:
Официальная демонстрация не показывает этот эффект.
Мой код выглядит примерно следующим образом
import { Menu, Icon } from "antd"
const myMenu: any = Menu; //workaround for missing selectable prop on Menu
const SubMenu = Menu.SubMenu;
// ...
render() {
// ...
return (
<myMenu
selectedKeys={[current]}
mode="inline"
selectable={false}
className="main-menu"
theme="dark"
style={{ height: '100%' }}
>
<SubMenu title={<span><Icon type="area-chart" />Data</span>}
key="Data"
onTitleClick={this.handleTitleClick}>
<Menu.Item key="FileUpload">
<Link to={config.uiBaseUrl + "FileUpload"}><Icon type="upload" />Import</Link>
</Menu.Item>
</SubMenu>
<SubMenu title={<span><Icon type="setting" />Settings</span>}
key="Settings"
onTitleClick={this.handleTitleClick}>
<Menu.Item key="Something else">
MyVeryVeryLongMenuEntry
</Menu.Item>
</SubMenu>
</myMenu >
);
}
}
Дальнейшее чтение