在这个界面的边栏上可以再添加一个导航菜单，回到项目，先在这个 index 布局的顶部导入需要用的 Ant Design 组件，从 antd 里面，把 Menu 拿出来。

然后在 Sider 组件里面，网站标志的下面，添加一组 Menu ， 菜单里的菜单项目可以使用 Menu.Item 组件， 菜单项目里可以包含一个小图标，用一下 Icon 组件，组件的 type 属性设置的是小图标的名字，用一下 dashboard 这个小图标。

然后用一组 span，菜单项目上的文字是 Dashboard 。 你会发现，现在边栏上会出现一个导航菜单，里面有一个菜单项目。

SubMenu

如果菜单项目里面包含一些子菜单，可以用一下 Menu.SubMenu 组件。 可以先把这个 SubMenu ，从 Menu 里面解构出来。

然后在这个 Menu 里面，再添加一个 SubMenu ， 子菜单项目的标题可以用 title 属性设置一下，这个标题里面我想包含一个小图标，先用一组 span ，里面包装一个 Icon 组件，组件的 type 是小图标的名字，用一下 appstore 这个小图标。

下面再用一组 span，文字是 Discover。

这个 SubMenu 里面再添加一些菜单项目，每个菜单项目就是一个 Menu.Item ，文字是 Popular。复制一份，再添加一个菜单项目，文字是 Fresh 。

预览

回到浏览器，再预览一下边栏上的这个导航菜单，这个导航里面，Discover 里面包装了一些子菜单，鼠标放在菜单项目的标题上，会弹出它里面包含的子菜单。

这个 Menu 组件上还有一些属性可以配置一下它的一些行为，在 Menu 上面，添加一个 mode，把菜单的模式设置成 inline 。

再回到浏览器试一下， 按一下 Discover ，会直接在边栏上显示出它里面包含的子菜单。