reactにiconを書き込む方法


JavaScriptを使用してプロジェクトを行う場合はfontawsomeを使用してアイコンを挿入します.
反応するのは難しい.
fontawesomeはhtmlにkit scriptを植え込む必要がありますが、反応器に適用するのは難しいです.この問題を解決するためには多くの複雑な過程が必要であるが,reaction−insでアイコンを簡単に挿入できることが分かった.

設定

yarn add react-icons --save
必要なアイコンを検索します.
import {FaUserCircle} from 'react-icons/fa';


function UserPanel() {
  return (
    <div>
      <h3>chat app</h3>
      <FaUserCircle/>
    </div>
アイコン名を入力すると、react-icons/の後にアイコン名の最初の2文字を小文字で書きます.
FaUserCircleの最初の2文字Faを小文字にし、reactions-icons/faをインポートすればよい.

Reference

  • https://react-icons.github.io/react-icons