• react 中引入 fontawesome 字体包。free-brands-svg 引入的使用问题


    以上就是具体的代码;

    使用步骤是:

    首先     npm i --save   @fortawesome/free-solid-svg-icons@prerelease

                @fortawesome/fontawesome-svg-core@prerelease
                @fortawesome/react-fontawesome@prerelease
                @fortawesome/free-brands-svg-icons@prerelease
                 @fortawesome/free-regular-svg-icons@prerelease
    然后在 index.js 引入
      
    import { library } from '@fortawesome/fontawesome-svg-core';
    import {
        faTachometerAlt,
        faAngleLeft,
        faAngleDown,
        faWifi,
        faUmbrella,
        faTasks,
        faLaptop
    } from '@fortawesome/free-solid-svg-icons';
    import { fab} from "@fortawesome/free-brands-svg-icons";//商标元素 则需要添加前缀
      import { far } from "@fortawesome/free-regular-svg-icons";
    
    library.add(
        faTachometerAlt,
        faAngleLeft,
        faAngleDown,
        faWifi,
        fab,
       far, faUmbrella, faTasks, faLaptop )

     在 其它组件中调用

    import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
      <FontAwesomeIcon icon="angle-left" className={Appcss.iconright} />
    使用fab 商标元素的时候添加前缀
     <FontAwesomeIcon icon={["fab","apple"]} className={Appcss.iconright} />                                                                                                      

    看不明白的同学也可以上这里看 https://reactjsexample.com/official-react-component-for-font-awesome-5/

  • 相关阅读:
    C#基础知识汇总(不断更新中)
    比较两个DataTable是否相等
    C#利用SerialPort控件进行串口编程小记
    C# ListBox 自动滚动到底部 方法:
    IIS配置文件的XML格式不正确 applicationHost.config崩溃 恢复解决办法
    net4log 添加自定义变量
    net4log 日志管理
    C#实现加简单的Http请求
    H5,Css小姐又作画了
    H5 ,Css实现了你的logo
  • 原文地址:https://www.cnblogs.com/RoadAspenBK/p/9988039.html
Copyright © 2020-2023  润新知