首页 > 解决方案 > 找不到图标为空

问题描述

我对此很陌生,我遇到了以下问题:

我在这样的类中从 fontAwesome 创建了自己的字体:

import {
  faArrowDown as fasArrowDown,
  faArrowLeft as fasArrowLeft,
  faBox as fasBox,
  faCheck as fasCheck,
  faCircle as fasCircle,
  faExchangeAlt as fasExchangeAlt,
  faTimes as fasTimes,
} from '@fortawesome/free-solid-svg-icons'

import { faCircle as farCircle } from '@fortawesome/free-regular-svg-icons'
export const getSendBack = (
  order,
  canSendBack,
  sendBackOrder,
  formatMessage
) => ({
  id: 'sendBack',
  dataTestId: 'button-context-send-back',

  iconSendBack: 'fa-layers fa-3x fa-fw',
  iconSendBackTransform1: 'down-5 right-8 shrink-3',
  iconSendBackTransform2: 'down-5 right-8 shrink-5',
  iconSendBackTransform3: 'down-5 right-8 shrink-10',
  iconFasBoxSendBack: fasBox,
  iconFarCircleSendBack: farCircle,
  iconFasCircleSendBack: fasCircle,
  iconFasArrowLeft: fasArrowLeft,
  disabled: !canSendBack(order),
  titleSendBack: 'SEND BACK',
  title: formatMessage(terms.send_back),
  popup: {
    onOk: () => sendBackOrder(order.id),
    text: formatMessage(terms.send_back_order_question),
    title: formatMessage(terms.send_back),
  },
})

然后我在另一个文件中使用了类中的对象,如下所示:

<span
 className={b.iconSendBack}
>
<FontAwesomeIcon
 icon={b.iconFasCircleSendBack}
 mask={b.iconFasBoxSendBack}
 transform={b.iconSendBackTransform1}
/>
<FontAwesomeIcon
 icon={b.iconFarCircleSendBack}
 transform={b.iconSendBackTransform2}
/>
<FontAwesomeIcon
 icon={b.iconFasArrowLeft}
 transform={b.iconSendBackTransform3}
/>
</span>

一切都很好,我可以看到我想要的字体,唯一的问题是我在控制台中收到以下警告,上面写着“找不到图标空”

在此处输入图像描述

您能否建议问题是什么以及如何解决?它是否与前缀或库有关?

标签: javascriptcssreact-reduxfont-awesome-5

解决方案


推荐阅读