J'ai deux fonctions dans mes composants react-app
Line 26:64: Expected to return a value in arrow function array-callback-return Line 36:64: Expected to return a value in arrow function array-callback-return
Quand je l'exécute, j'obtiens:
componentDidMount() { if(Object.keys(this.props.praticiens).length>0) Object.keys(this.props.praticiens).map((praticien) => { if(this.props.praticiens[praticien].identifiant_user === getUrlParams(window.location.hash).identifiant_user) this.setState({ praticien:this.props.praticiens[praticien].id_user }) }) } handleChangePraticien = (praticien) => { this.setState({ praticien }, () => { Object.keys(this.props.praticiens).map((praticien) => { if(this.state.praticien === this.props.praticiens[praticien].id_user) this.props.selectPraticienFunction(this.props.praticiens[praticien].identifiant_user); }) }) }
Tels que la ligne 26 commence Object.keys(this.props.praticiens).map((praticien) => {
sur componentDidMount et la ligne 36 est la même ligne sur la fonction handleChangePraticien
Comment puis-je y remédier?
4 Réponses :
Vous utilisez la map
comme si elle était forEach
. N'utilisez pas map
sauf si vous allez utiliser le tableau qu'il crée à partir des valeurs de retour du rappel. Utilisez forEach
, for-of
ou l'une des nombreuses autres façons de parcourir les tableaux décrits dans cette réponse .
Ligne 26:64: devrait renvoyer une valeur dans la fonction de flèche array-callback-return
Puisque vous ne vous souciez pas de renvoyer une valeur à partir de la fonction de flèche et que vous n'utilisez pas le tableau retourné par la
map()
, vous devriez utiliser la fonctionforEach()
place.componentDidMount() { if(Object.keys(this.props.praticiens).length>0) Object.keys(this.props.praticiens).forEach((praticien) => { if(this.props.praticiens[praticien].identifiant_user === getUrlParams(window.location.hash).identifiant_user) this.setState({ praticien:this.props.praticiens[praticien].id_user }) }) } handleChangePraticien = (praticien) => { this.setState({ praticien }, () => { Object.keys(this.props.praticiens).forEach((praticien) => { if(this.state.praticien === this.props.praticiens[praticien].id_user) this.props.selectPraticienFunction(this.props.praticiens[praticien].identifiant_user); }) })
Array.prototype.forEach () et Array.prototype.map () sont utilisés à deux fins différentes.
Le Array.prototype.forEach est utilisé pour simplement boucler sur les éléments d'un tableau mais ne renvoie aucune valeur spéciale. Sa signature est:
forEach(callback, [thisArg]) => undefined
Seul le callback
du premier argument est obligatoire et sa signature est (current [, index, array]) => void
où le seul argument requis est current
Exemple
[1,2,3].map(item => item ** 2) // Output [1 4 9]
Cette fonction est principalement utilisée pour créer un nouveau Array
partir d'un autre. Contrairement à la fonction forEach
, elle renvoie un Array
. Sa signature est la suivante:
forEach(callback [, thisArg]) => Array
. Tout comme forEach
, seul le premier argument est obligatoire mais la signature de rappel est différente: (current [, index, array]) => any
. Le tableau final contiendra toutes les valeurs renvoyées par le rappel après chaque itération.
Exemple
[1,2,3].forEach( item => console.log(item)) // Output 1 2 3 undefined
Plus d'informations là-bas:
Merci pour cette explication
Je vous en prie. Désolé pour la réponse tardive.
Changer {} en () a fonctionné pour moi
de la map(() => {})
à la map(() => ())
Vos instructions if nécessitent des crochets
{}
. Vous ne pouvez les supprimer que si la ligne à l'intérieur de l'instruction if est une seule ligne.@theblackgigant - Une seule instruction , pas une seule ligne. Ce sont toutes des déclarations uniques. (Cela dit, je préfère de loin toujours utiliser
{}
sur les statmenets de flux de contrôle.)