【微信小程序】小程序使用彩色iconfont

情景再现

在给自己写记账本的时候，发现图片做起来不方便，更新需要重新提交小程序代码，所以打算把卡类型放到数据库，转而使用iconfont作为卡显示

问题

正常的使用iconfont是去色的，平时html使用彩色iconfont也需要小调一下，那么，iconfont怎么使用彩色呢

解决

1. 先下载自己的项目iconfont
   
2. 安装iconfont-tools

   npm i -g iconfont-tools
   

3. 在项目iconfont解压目录运行iconfont-tools

   iconfont-tools
   

   根据提示一步一步输入或按回车
   
4. 然后将输出文件iconfont-weapp-ico.css或iconfont-weapp-ico.wxss复制到你的小程序项目里面，并重命名为.wxss后缀，
5. 引入并使用

   /* 引入并重新设置大小 */
   /* pages/cards/carditem.wxss */
   @import "/icons/t-icon.wxss";
   .item .t-icon {
   width: 30px !important;
   height: 30px !important;
   }
   

   <!-- 平时使用方法 -->
   <view class="iconfont iconfont-alipay">
   <!-- 转彩色后的使用方法 -->
   <view class="item">
    <label class='t-icon t-iconfont-alipay'></label>
   </view>
   

   感谢iconfont各位提供的icon