Le të importojmë ikonat në Projektin tonë React
Qëllimi i vetëm i këtij lloji të përmbajtjes është t'u japë pak dritë zhvilluesve të rinj si unë për të kapur shpejt mënyrat praktike të zbatimit të gjërave duke përdorur react. Ju inkurajoj të gjithëve që të lexoni dokumentacionin origjinal në lidhje me paketën dhe të largoni frikën nga leximi i dokumentacionit dhe zbatimi i tij.
Na duhen ikona për të shfaqur qartë përmbajtjen. Pra, në këtë artikull, unë do të ndaj mënyrën time të përdorimit të ikonave në projektet e mia të reagimit.
Ekzistojnë biblioteka të mrekullueshme të ikonave të reagimit të disponueshme në internet. Disa prej tyre janë
* Ant-Design Library
* Font Awesome
* Bootstrap Icons
* Devicons
Ne mund t'i përdorim të gjitha këto biblioteka ikonash pa i instaluar veçmas duke përdorur paketën react-ikona npm
Ikonat e reagimit npm
Instaloni paketën e ikonave react duke përdorur npm ose fijenpm install react-icons — save
Pas instalimit, mund të importoni çdo bibliotekë në react duke përdorur deklaratën import.
Importoni ikonat e dizajnit të milingonave
import { IconName } from “react-icons/ai”;
Importoni ikonat e bootstrap
import { IconName } from “react-icons/bs”;
Mund ta përdorni si më poshtë
Projekt Live
Ne gjithashtu mund të shtojmë API-në e kontekstit react për të shtuar stilimin për çdo ikonë menjëherë. Pra, nuk ka nevojë të shtoni të njëjtën ngjyrë dhe stil në çdo komponent ikonë
Ju mund të importoni IconContext dhe t'i shtoni atij stil
import {IconContext} from 'react-icons';
Dhe mbështillni ikonat me kontekst
Ju mund ta shikoni projektin live nga këtu.