Discussion :

[Hawthorne]

Bonjour à tous,

Ce que je cherche à faire est vraiment tout bête mais je ne trouve nulle part comment faire, et mes tentatives n'ont pas été très fructueuses ...
Mon objectif c'est d'avoir une fonction qui crée un tableau contenant les valeurs qui me permettront ensuite d'initialiser un certain nombre de composant avec un map.

Je pensais à quelque chose comme ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
	genererValeursCase() {
		const result = []
		for(var i=1 ; i <= NOMBRE_CASES ; i++) {
			result.push({id: i, name: "case" + i})
		}
		return result
	}

L'objectif étant ensuite de créer un certain nombre de cases en ayant un id et un nom.

Qu'est-ce que je loupe ?

[Invité]

Bonjour,

• il manque le terme function ...
• NOMBRE_CASES n'est pas défini
• const définit une constante
• ...

Bref : tout est faux.

Il faut vraiment que tu commences par les bases du JavaScript.

[Hawthorne]

Oui j'ai oublié de mettre cette ligne là !
je le met en constante au début du fichier de la sorte :
const NOMBRE_CASES = 25

Dans mon cas il me faudra surement faire des milliers de cases, du coup c'est pour ça que je cherche à pouvoir facilement et rapidement créer tout ces composants.

[Invité]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
"use strict";
const NOMBRE_CASES = 25;
function genererValeursCase() {
		let result = [];
		for(let i=1; i<=NOMBRE_CASES; i++) {
			result.push({id: i, name: "case" + i});
		}
		return result;
	}
console.log( genererValeursCase() );

Voir aussi : Le mode strict ("use strict";)

[Hawthorne]

Merci pour ce code !
En effet ça fonctionne bien, dans la console je vois bien le résultat et le contenu du tableau.

Par contre comment je fais pour attribuer ce résultat à une variable ?

Car j'ai essayé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var infosCarte = genererValeursCase()

et puis dans mon render :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

{infosCarte}

et là ça plante avec l'erreur :
Objects are not valid as a React child (found: object with keys {id, name}). If you meant to render a collection of children, use an array instead.

[Invité]

Je ne connais pas la syntaxe React.

Mais c'est un array contenant des objets.

[Hawthorne]

J'ai pu faire un map sur la fonction en elle même :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<div className = "infosCarte">
	{
		genererValeursCase().map(({id, name}) => (
			<p>Id : {id} et Name : {name}</p>
		))
	}
</div>

Mais si jamais quelqu'un sait comment affecter le résultat de la fonction à une variable, pour ensuite faire le mpa sur la variable par exemple, je ne suis pas contre !

Merci beaucoup déjà pour m'avoir débloqué

[Invité]

...Mais si jamais quelqu'un sait comment affecter le résultat de la fonction à une variable...

Ça tu sais faire :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var infosCarte_array = genererValeursCase();

Ensuite, en JS, on parcourt l'array, avec for(...of...) (par exemple) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
let infosCarte_array = genererValeursCase();
for( let infosCarte of infosCarte_array)
{
  console.log( infosCarte.id, infosCarte.name );
}

Ça, ça reste du JS "classique".