Я пытаюсь заставить функцию работать, возвращая список с различными элементами. Но это у меня проблемы с иконками. Есть идеи? Если я изменю его на faHome в функции, я получу значок, но просто не могу заставить его работать в списке.
import React from 'react';
import styles from './sideNav.module.css';
import { Link } from 'react-router-dom';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faHome } from '@fortawesome/free-solid-svg-icons';
const SideNavItems = () => {
const items = [
{
type: styles.option,
icon: "faHome",
text: 'Homes',
link: '/'
},
{
type: styles.option,
icon: 'faHome',
text: 'News',
link: '/news'
}
];
const showItems = () => {
return items.map ( (item,i) => {
return (
<div key={i} className={item.type}>
<Link to={item.link}>
<FontAwesomeIcon icon={item.icon}
style={{color:'#ffffff', cursor: 'pointer', marginRight:'10'}}/>
{item.text}
</Link>
</div>
)
} )
}
return (
<div>
{showItems()}
</div>
)
}
export default SideNavItems;