<
StarTwoTone
twoToneColor
=
"
#eb2f96
"
/>
自定义 Icon
|
参数
|
说明
|
类型
|
默认值
|
版本
|
|
component
|
控制如何渲染图标，通常是一个渲染根标签为
<svg>
的 React 组件
|
ComponentType<CustomIconComponentProps>
|
-
|
|
|
rotate
|
图标旋转角度（IE9 无效）
|
number
|
-
|
|
|
spin
|
是否有旋转动画
|
boolean
|
false
|
|
|
style
|
设置图标的样式，例如
fontSize
和
color
|
CSSProperties
|
-
|
|
关于 SVG 图标
在
3.9.0
之后，我们使用了 SVG 图标替换了原先的 font 图标，从而带来了以下优势：
-
完全离线化使用，不需要从 CDN 下载字体文件，图标不会因为网络问题呈现方块，也无需字体文件本地部署。
-
在低端设备上 SVG 有更好的清晰度。
-
支持多色图标。
-
对于内建图标的更换可以提供更多 API，而不需要进行样式覆盖。
更多讨论可参考：
#10353
。
所有的图标都会以
<svg>
标签渲染，可以使用
style
和
className
设置图标的大小和单色图标的颜色。例如：
import { MessageOutlined } from '@ant-design/icons';
<MessageOutlined style={{ fontSize: '16px', color: '#08c' }} />;
双色图标主色
对于双色图标，可以通过使用
getTwoToneColor()
和
setTwoToneColor(colorString)
来全局设置图标主色。
import { getTwoToneColor, setTwoToneColor } from '@ant-design/icons';
