react+webpack+antd框架自定义使用阿里iconfont图标。

 

1. 首先打开iconfont,找到咱们须要的icon,若是要icon跟随字体选中状态的颜色改变而改变,尽可能使用单色图标。如图:html


二、加入购物车以后,点击下载代码,放到桌面,将文件夹下的iconfont.js文件引入项目中,我通常放在util文件夹下,如图:react


三、在须要的.jsx页面下引入咱们的iconfont.js文件:antd

```
import iconFont from '../../../utils/iconfont.js'
const IconFont = Icon.createFromIconfontCN({
scriptUrl: iconFont
})
```
四、在render中键入咱们下载好的icon名称,能够在download文件夹下打开demo_fontclass.html页面,复制类名,加入到咱们render中:框架

 


五、.jsx页面图标代码:字体

```
render () {
<IconFont type='icon-kaoherenwujihua' />
}
```
六、最后已经引入成功了,根据选中状态自动跟随文字颜色。
3d

 

小仙女奉上,有什么不对的能够畅所欲言哦!!!!!!react+antd框架自定义使用阿里iconfont图标。htm

相关文章
相关标签/搜索