我将此对象用作React.js组件道具。但是发送后,FontAwsome无法找到通过的图标
{
key: 'editButton',
title: 'Edit',
icon: 'faEdit',
function: null,
type: 'default ',
},
{
key: 'deleteButton',
title: 'Delete',
icon: 'faTrash',
type: 'danger',
function: null,
},
我的组件:
<FontAwesomeIcon icon={item.icon} />
错误:
index.js:1 Could not find icon {prefix: "fas", iconName: "faEdit"}
答案 0 :(得分:1)
如果需要将其作为字符串值传递,则需要先对其进行预注册: https://fontawesome.com/how-to-use/javascript-api/methods/library-add
另请参见:Import all icons from Fontawesome
否则,您可以显式传递它们:
import { faEdit } from '@fortawesome/free-solid-svg-icons';
...
{
key: 'editButton',
title: 'Edit',
icon: faEdit,
function: null,
type: 'default ',
},
答案 1 :(得分:0)
我通过一个简单的条件解决了这个问题。 在这里调用组件使用
<componentName theIcon="faCrown" />
在渲染 componentName 时,我使用了
<FontAwesomeIcon icon={props.theIcon=== "faCrown" ? faCrown: faLink} />
您还需要导入这些图标