Le code ne casse pas l'application, mais la console me montre cette erreur.
Chaque enfant dans une liste doit avoir une "touche" unique Prop. P>
return (
<Table.Row>{listDays}</Table.Row>
)
3 Réponses :
Ma solution est la suivante:
render() {
const daysOfWeek = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
const listDays = daysOfWeek.map((dayName) =>
<Table.HeaderCell key={dayName.toString()}>{dayName}</Table.HeaderCell>
);
Problème est TABLE.HeaderCell est répété plusieurs fois en raison du rendu à l'intérieur de la boucle, une autre solution pourrait donc être
render() {
const daysOfWeek = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
const listDays = daysOfWeek.map((dayName, index) =>
<Table.HeaderCell key={index}>{dayName}</Table.HeaderCell>
);
Fabricio, faites-le comme ça de sorte que la clé reste unique tout le temps.
render() {
const daysOfWeek = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
const listDays = daysOfWeek.map((dayName, index) =>
<Table.HeaderCell key={index}>{dayName}</Table.HeaderCell>
);
Eh bien, l'avertissement est assez clair et une recherche Google rapide montrerait des tonnes d'informations sur cet avertissement.
.map () renvoie une matrice, chaque élément parent JSX renvoyé a besoin d'une clé d'identification, par exemple. {DayName} . Faites des recherches sur la raison pour laquelle les éléments de tableau ont besoin de clés et de ce qu'ils sont utilisés pour réagir Presque simple comme ça, je trouve dans la documentation dans ReaC Page Ceci, Codepen.io/gaearon/ stylo / jrxyrr? Editors = 0011