Ant Design Menu 组件图标修改指南

要修改 Ant Design 的 Menu 组件的 marker（菜单项前的图标），可以使用 MenuItem 的 icon 属性来设定。

首先，你需要引入 Menu 和 MenuItem 组件：

import { Menu } from 'antd';
const { SubMenu } = Menu;

然后，在 Menu.Item 上使用 icon 属性来设定图标，可以是 Ant Design 内置的图标或者自定义的图标组件：

<Menu mode="vertical">
  <Menu.Item key="1" icon={<YourIconComponent />}>
    菜单项1
  </Menu.Item>
  <Menu.Item key="2" icon={<YourIconComponent />}>
    菜单项2
  </Menu.Item>
  <SubMenu key="sub1" icon={<YourIconComponent />} title="子菜单">
    <Menu.Item key="3" icon={<YourIconComponent />}>
      子菜单项1
    </Menu.Item>
    <Menu.Item key="4" icon={<YourIconComponent />}>
      子菜单项2
    </Menu.Item>
  </SubMenu>
</Menu>

在上面的代码中，`` 是你自定义的图标组件，你可以根据自己的需求来替换它。如果你想使用 Ant Design 内置的图标，可以使用其提供的图标组件，例如 ``。

通过设置 icon 属性，你可以为每个菜单项设置不同的图标。如果你不需要图标，可以将 icon 属性设置为 null。

这样就可以修改 Ant Design 的 Menu 组件的 marker（菜单项前的图标）了。