Comment puis-je nommer dynamiquement les composants React dans JSX ?

Nommer dynamiquement les composants React dans JSX

Dans le développement React, il peut être avantageux de restituer dynamiquement les composants en fonction de leur type. Cependant, les tentatives d'utilisation de la syntaxe de tableau ou de création d'une nouvelle méthode pour chaque composant peuvent entraîner des erreurs ou un code verbeux.

Solution élégante

Une solution plus élégante consiste à stocker la classe de composant dans une variable avec une première lettre majuscule. Cela suit la convention balises HTML vs composants React. Par exemple :

var MyComponent = Components[type + "Component"];
return <MyComponent />;

Ceci compile en :

var MyComponent = Components[type + "Component"];
return React.createElement(MyComponent, {});

Vous pouvez également utiliser l'approche recommandée par la documentation officielle, qui consiste à spécifier le type de composant au moment de l'exécution :

return React.createElement(type, { /* props */ });

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!