-
Notifications
You must be signed in to change notification settings - Fork 264
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Icon from variable #547
Comments
@rwb196884 I got your example to work by changing the following: import "./styles.css";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { fas } from "@fortawesome/free-solid-svg-icons";
// what you were trying to use...
const i: string = "circle-exclamation";
// ...but the string format needs to be like this to work
const icon: string = "faCircleExclamation";
export default function App() {
return (
<div className="App">
<h1>Hello CodeSandbox</h1>
<h2>Start editing to see some magic happen!</h2>
<p>
Icon {i} is <FontAwesomeIcon key={i} icon={fas[icon]} />
</p>
</div>
);
} In other words, it appears to be the naming of your icon that is giving you the trouble. If instead you wanted to stick with your chosen naming, then you could do something like the following examples from the official documentation. |
@rwb196884 You should import the icon (or all icons) and add it to your library. Codesandbox: |
I want to insert an icon the name of which is stored in a variable.
Something like
At present this is impossible.
None of the suggestions at https://stackoverflow.com/questions/69475336 work.
https://codesandbox.io/s/dreamy-wescoff-hyd1yo?file=/src/App.tsx
The text was updated successfully, but these errors were encountered: