- 由于是第一次在react项目中使用iconfont，所以我一开始使用的并不是通过symbol属性引入的图标，而是通过font class的方式，通过这样的方式虽然也可以成功将图标引入到项目中，但是最后你会发现一个问题：图标没有颜色，即使原本在iconfont上五颜六色的图标，到了项目中也是黑白的，在我百度了许久之后成功的解决了黑白图标的问题，步骤如下：
一、打开iconfont搜索图标并且添加到购物车
添加到购物车.png
二、将购物车中的图标添加到项目中，若是新项目，则可以新建项目，并将图标添加进去
添加至项目.png
新建项目.png
三、选择symbol方式，点击生成在线链接
image.png
四、将生成的链接复制到react项目public目录下index.html文件中，通过script标签引入，需要注意的是要加上链接的前缀http:
完整链接如下：
<script src="http://at.alicdn.com/t/font_1952298_yxs12560py.js"></script>
五、在项目中需要使用到图标的地方用以下svg标签方式引入
<svg className="icon" aria-hidden="true">
<use xlinkHref="#icon-wangyueche"></use>
</svg>
其中xlinkHref属性中#后面的就是iconfont中给我们的类名，只要把对应的类名写到这，页面中就能显示出图标，但是没有设置基础样式，所以看起来有点小，
我的icon类名样式是这样写的
.icon {
width: 2em;
height: 2em;
fill: currentColor;
display: block;
}
-
大家可以根据自己项目的需要来修改样式成想要的样子
下面是结果：
结果.png
