L'échafaudage React introduit une solution au problème selon lequel les images publiques ne peuvent pas être affichées dans le composant.

1. L'apparition de problèmes

1.1. Lorsque j'ai utilisé React Scaffolding pour écrire un projet aujourd'hui, j'ai rencontré le problème suivant :
j'ai introduit une image publique dans le composant, mais elle n'a pas pu être affichée. Mon chemin a été écrit selon les invites, il ne doit donc y avoir aucun problème. .

   <img src='../../../public/icons/tabs_false/未选中-首页.png' alt="首页" /></div>

2. Processus de résolution

2.1. L'échec d'affichage doit être un problème de chemin. La première chose à laquelle j'ai pensé a été d'utiliser %PUBLIC_URL% pour diriger le répertoire public.

 <img src='%PUBLIC_URL%/icons/tabs_false/未选中-首页.png' alt="首页" /></div>

Résultat : il ne peut pas être résolu et il ne peut toujours pas être affiché.
2.2. J'ai soudainement pensé : ce composant ne devrait-il pas être inséré dans le composant App ? Le chemin doit-il donc être le chemin de l’application et de l’image ?

  <img src='../public/icons/tabs_false/未选中-首页.png' alt="首页" /></div>

Résultat : Impossible à résoudre, mais ne peut toujours pas être affiché

3. Solutions

3.1. J'ai commencé à être confus et j'ai finalement trouvé une solution sur Internet : les ressources statiques commenceront par défaut par le chemin public, et il vous suffit d'écrire le chemin suivant.

  <img src='/icons/tabs_false/未选中-首页.png' alt="首页" /></div>