web-dev-qa-db-fra.com

Réagir: Attendu une affectation ou un appel de fonction et voir une expression à la place

J'essaie de corriger cette erreur de peluche à la ligne const def = (props) => { dans l'exemple de code suivant.

const propTypes = {
prop1: PropTypes.string,
prop2: PropTypes.string,
prop3: PropTypes.string,
prop4: PropTypes.string,
prop5: PropTypes.string,
}

const abc = (props) => {
some code here }

const def = (props) => {
<div>
<div className=" ..some classes..">{abc}</div>
<div className=" ..some classes..">{t('translation/something')}</div>

<div ...>
  <someComponent 
    do something
  />

if (some condition) {
do this
} else {
do that
}

</div>

};

Une idée pourquoi j'obtiens cette erreur de peluche?

11
User7354632781

Vous ne renvoyez rien, du moins à partir de votre extrait et de votre commentaire.

const def = (props) => { <div></div> };

Cela ne renvoie rien, vous enveloppez le corps de la fonction flèche avec des accolades mais il n'y a pas de valeur de retour.

const def = (props) => { return (<div></div>); }; OR const def = (props) => <div></div>;

Ces deux solutions, en revanche, renvoient un composant React valide. Gardez également à l'esprit que dans votre jsx (comme mentionné par @Adam), vous ne pouvez pas avoir if ... else ... mais uniquement des opérateurs ternaires.

20
G4bri3l