24 votes

Nom d'affichage manquant dans la définition du composant react / display-name

Comment ajouter un nom d'affichage à cela?

 export default () =>
  <Switch>
    <Route path="/login" exact component={LoginApp}/>
    <Route path="/faq" exact component={FAQ}/>
    <Route component={NotFound} />
  </Switch>;
 

45voto

Tholle Points 28692

Placez la fonction dans une variable, définissez displayName sur la fonction, puis exportez-la.

 const MyComponent = () => (
  <Switch>
    <Route path="/login" exact component={LoginApp}/>
    <Route path="/faq" exact component={FAQ}/>
    <Route component={NotFound} />
  </Switch>
);

MyComponent.displayName = 'MyComponent';

export default MyComponent;
 

3voto

estus Points 5252

Un moyen d'ajouter la propriété displayName à une fonction de composant anonyme sans créer de fonction nommée consiste à utiliser recompose :

 import { compose, setDisplayName } from 'recompose';

export default compose(setDisplayName('SomeComponent'))(props => ...);
 

Ou juste:

 export default Object.assign(props => ..., { displayName: 'SomeComponent' });
 

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X