Scribd
Importer
3 vues1 page

Textinput - JS: Considérons Un Projet React Appelé "TP"

Le document décrit les étapes pour créer un projet React nommé 'TP', incluant la commande de création du projet. Il fournit également des instructions pour coder deux composants React, TextInput et Membre, ainsi qu'un composant Membres pour afficher une liste de membres. Des exemples de code et de structure de données sont fournis pour illustrer les fonctionnalités attendues.

Transféré par

elhaddiouinouhaila
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
3 vues1 page

Textinput - JS: Considérons Un Projet React Appelé "TP"

Le document décrit les étapes pour créer un projet React nommé 'TP', incluant la commande de création du projet. Il fournit également des instructions pour coder deux composants React, TextInput et Membre, ainsi qu'un composant Membres pour afficher une liste de membres. Des exemples de code et de structure de données sont fournis pour illustrer les fonctionnalités attendues.

Transféré par

elhaddiouinouhaila
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

TP4

Considérons un projet React appelé "TP" :


1. Quelle est la commande pour créer ce projet ?
2. Écrire le code du fichier [Link] afin d'y déclarer un composant React. Celui-ci
devra :

• Afficher un input de type text (élément HTML de base : <input type="text">)


• Insérer l’évènement onChange qui permet d’afficher le texte saisit dans une div

NB : l’appel de ce composant est défini dans le fichier [Link] sous cette forme : < TextInput />

3. Écrire le code du fichier [Link] afin d'y déclarer un composant React. Celui-ci
devra afficher un Membre passé dans les propriétés du composant. (utiliser la balise
table html)

Exemple d’appel et d’apparence :


<Membre key={[Link]} nomcomplet= "[Link]"
addresse="[Link]" avatar="[Link]" />

4. Créer un composant <Membres /> qui permet d’afficher tous les membres

Soit la variable membres qui contient les informations des membres


const membres = [
{
id: 1,
nomcomplet: 'zaher mechbouk',
addresse: 'xxxxxxxxxxxxxxxxx',
avatar : [Link]'
},
{
id: 2,
nomcomplet: 'aissam elazouzi',
addresse: 'xxxxxxxxxxxxxxxxxxxx',
avatar : '[Link]'
}
]

Vous aimerez peut-être aussi