Discussions

Case cochée dans le composant task.

Image

Bonjour Louis-Nicolas, concernant la gestion du strike et de la case cochée dans le composant Task.jsx je propose ce un peu plus condensé, il fonctionne très bien, qu'en penses-tu ?

 

         <div className="content">
            <svg
               xmlns="http://www.w3.org/2000/svg"
               width="16"
               height="16"
               fill="currentColor"
               viewBox="0 0 16 16"
            >
               <path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
               { done && <path d="M10.97 4.97a.75.75 0 0 1 1.071 1.05l-3.992 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425a.235.235 0 0 1 .02-.022z" /> }
            </svg>

            {done ? <strike>content</strike> : content}
         </div>

 

 

Cordialement

 

Sébastien Collin

 

3 réponses
Image
Louis-Nicolas Leuillet
Le 02/01/2024 à 13:49

Hello Sébastien,

C'est effectivement plus condensé, je valide !

Meilleure réponse
Image
Sébastien Collin
Le 02/01/2024 à 14:11

erratum : pour la ligne  {done ? <strike>content</strike> : content} il faut passer {done ? <strike>{content}</strike> : content}

 

Cordialement

Image
Sébastien Collin
Le 15/05/2024 à 12:32

Utilisation du fowardRef de react

 

Hello, je me suis amusé à créer 3 composants dans ce projet : 

  • - Header pour le titre
  • - Add pour le formulaire d'ajout
  • - Task pour les taches

 

Pour pouvoir passer des refs du composant App au composant Add il faut utiliser la fonction fowardRef  de react comme dans l'écran si dessus, sinon ela ne fonctionne pas. 

 

 

Cordialement

Image
Inscrivez-vous ou connectez-vous pour participer à la discussion.
Discussion résolue

Informations

Créée le January 2, 2024 1:47 PM
Dernière activité le May 15, 2024 12:32 PM