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.)