使用@ant-design/icons Icon自定义图标

`@ant-design/icons` 是 Ant Design 图标库的一个模块，它提供了一系列基于 SVG 的可复用图标，可以方便地用于 React 或 Vue 等前端框架中。如果你想在项目中自定义图标，你可以按照以下步骤操作：

1. **引入依赖**：首先需要安装 `@ant-design/icons` 和相应的 CSS 文件到你的项目中。如果你使用的是 npm，可以在命令行输入 `npm install @ant-design/icons antd`。

2. **导入图标组件**：在需要使用的文件中，通过 `import` 导入你想定制的图标，例如：

   import { EditOutlined } from '@ant-design/icons';

3. **使用图标**：然后你可以直接在 JSX 中使用图标，例如显示编辑图标：

   <EditOutlined />

4. **自定义图标**：`@ant-design/icons` 提供了丰富的基础图标，如果你想创建自定义图标，可以通过 `Icon` 组件结合 SVG 标签或者第三方库如 `react-icons` 来实现。你可以在外部定义一个 SVG 或者 CSS 渲染的样式，并传给 `Icon` 组件，例如：

   const CustomIcon = () => (
     <Icon type="custom" style={{ color: 'red', fontSize: '2em' }}>
       <svg>...</svg>
     </Icon>
   );

在这个例子中，`type="custom"` 表示自定义图标，`style` 属性允许你调整图标外观。