Correction du paramètre index dans les props click pour React 18

Question

Bonjour Louis-Nicolas, Ceci n'est pas vraiment une question, juste une remarque pour ceux qui suive ce cours (dans sa version actuelle) avec la V.18 de React. J'ai remarqué que la solution donnée dans le cours ne fonctionne pas, il faut ajouter le paramètre index dans les paramètres de la props click sinon React nous renvoi une erreur. J'en ai déduis que cela provenait de la version de React, dis moi si je me trompe, je met le code ci-dessous : const buttonClickedHandler = (nouveauNom, index) => { const nouveauxEleves = [...eleves]; nouveauxEleves[index].nom = nouveauNom; setEleves(nouveauxEleves); setTransformation(true); } let cartes = eleves.map((eleve, index) => { return ( buttonClickedHandler("Léa", index)} removed={() => removeClickHandler(index)} > {eleve.citation} ); });

Louis-Nicolas Leuillet · Accepted Answer

Bonjour Antoine.
Tu as parfaitement raison. Je prévoie une mise à jour totale du cours en septembre, merci pour ton code.

4.No.NY.MouS · Answer

Je t'en prie, c'est avec plaisir.
J'ai tout de même remarqué qu'en faisant cela, le bouton « transformer le premier élève » ne fonctionne plus. J'ai une erreur :
App.js:61 Uncaught TypeError: Cannot set property 'name' of undefined
at buttonClickedHandler (App.js:61)
J'essaie de trouver une solution pour modifier ça dans le post. Si tu as la solution ou un indice, je suis preneur, mais vais quand même essayer de trouver ça par moi-même ;)
Hâte d'être en septembre pour voir ça :)

Louis-Nicolas Leuillet · Answer

C'est toujours le même code aussi ? Il n'y a pas de "name" en propriété c'est pour ça :)

4.No.NY.MouS · Answer

Oui, le code reste inchangé par rapport à ta version de correction. Le seul changement est juste dans le code au-dessus concernant la propriété click .
Effectivement, ça paraît logique une fois que c'est dit ;)
Merci pour la solution :)

Youssouff Lyy · Answer

Bonjour, une question qui me tracasse : pourquoi eleves qu'on a mis dans le state vaut toute la div Eleve avec son CSS, etc. ? Donc, lorsqu'on supprime eleve , c'est toute la carte qui est supprimée. Je croyais que notre state stockait juste nos données et non pas la carte entière. Donc, dans ma logique, en supprimant avec splice , je m'attendais à voir disparaître les données de nos élèves ( Eva Dupont , age ...) et non pas toute la div carte. C'est pourquoi je me dis qu'il y a quelque chose que j'ai loupé ou que je n'ai pas saisi avec l'utilisation du state .

Correction du paramètre index dans les props click pour React 18

Créez des sites internet interactifs avec React 16 et Redux