weapp fontawesome component

weapp–fontawesome–component

微信小程序的 fa 图标模块，项目使用 fa 的 4.x 版本

安装说明

1. 将 src/components 中的文件复制到项目中的 components 路径下.

加载说明

1. 在需要引入的 页面（Page） 或者 模块（Components） 中引入这个模块
   1. 编辑页面/模块中的 json 文件
   2. 在 json 文件中添加如下内容

   {
     ...
     \"usingComponents\": {
       ...
       \"fa\": \"../<PATH_TO_YOUR_COMPONENT_ROOT>/includes/fa/index\",
       ...
     }
     ...
   }

用法

基本用法和fa 用法类似，下面列出一些用法是之前项目开发时候用到的，确认可以使用，其他用法请自行测试。

基本图标

在 wxml 中使用 fa 标签：Example：

<fa icon=\"fa fa-home\"></fa>

大图标

<fa icon=\"fa fa-home fa-lg\"></fa> fa-lg
<fa icon=\"fa fa-home fa-2x\"></fa> fa-2x
<fa icon=\"fa fa-home fa-3x\"></fa> fa-3x
<fa icon=\"fa fa-home fa-4x\"></fa> fa-4x
<fa icon=\"fa fa-home fa-5x\"></fa> fa-5x

堆叠图标

<fa icon=\"fa-stack fa-lg\">
    <fa icon=\"fa fa-user-o fa-stack-1x\"></fa>
    <fa icon=\"fa fa-circle-thin fa-2x fa-stack-2x\"></fa>
</fa>

图标颜色

组件集成了一些bootstrap 4 的默认颜色，可以直接调用

<fa icon=\"fa fa-ban text-danger\"></fa>

参考来源

80percent/wechat-weapp-font-awesome

southyou/wxcss-fontawesome