Question

在更新到antd版本2.13.14（实际上是2.x的最新版本）之后，我的侧菜单发生了奇怪的事情-如果折叠带有较长标签的菜单项，则会出现间隙，请参见红色标记在屏幕截图上：

official demo没有显示此效果。

我的代码大致如下

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 >
        );        
    }
}

Antd Sider根据展开的子菜单的宽度更改菜单项背景的宽度

进一步阅读

0 个答案: