在 react 中,使用ant design 框架中的自定義圖標
- 首先,複製例子中的代碼:
其中,import { createFromIconfontCN } from '@ant-design/icons'; const IconFont = createFromIconfontCN({ scriptUrl: '//at.alicdn.com/t/font_8d5l8fzk5b87iudi.js', });
scriptUrl
是需要自己生成的。 - 那麼接下來打開阿里巴巴圖標官網 ,登錄後,選擇圖標並加入購物車,同時添加進項目裏面。
- 進入項目,點擊
Symbol
選項卡,然後生成項目鏈接。 - 把上面代碼中的
scriptUrl
替換成新生成的鏈接。 - 之後就可以使用了:
<IconFont type="icon-tuichu" />
type
就是你添加中項目裏面的圖標名稱。
注意:每次添加新圖標後,需要更新一下鏈接。上面的組件名稱iconfont
可以自己定義成任何名字。