react项目中iconfont的使用方法

项目中通常使用iconfont作为图标显示的方案。下面介绍如何在项目中配置它。准备工作首先配置工程，关键需要注意FontClass/Symbolprefix和FontFamily这两个配置。我们配置好项目后，就可以导出样式文件，复制下图中css链接中的内容，以备日后使用。Dinner开始创建Icon.js文件。importReactfrom'react';importclassNamesfrom'classnames';import'./iconfont.less';//从上面的iconfont复制的css文件内容import'./icon.css';constIcons=(props)=>{const{type,spin,className='',...others}=props;constcls=classNames({'unovo-iconfont':true,[`unovo-iconfont-${type}`]:true,'unovo-iconfont-spin':!!spin,},className);返回();};导出默认图标；创建iconfont.less。@keyframesicon-spin{from{transform:rotate(0deg);}到{变换：旋转（360deg）；}}@iconfont-css-prefix:unovo-iconfont;.@{iconfont-css-prefix}-spin:before{display:inline-block;animation:icon-spininfinite1slinear;}然后像这样使用